Problems customizing a new theme

[Gabriela Cabañas]

Hello,

I'm trying to customize a new theme for the institution I'm working for but I've got a problem visualizing the changes.

I installed AtoM via the repository and followed the instructions in the theming guide for creating a new one but when I run npm run build and sign in again for changing the theme in the list available, the new theme does not appear in the list and if I try to change the css of a default theme like arDominionPlugin and run npm run build no changes are applied.

What am I doing wrong?

[Dan Gillean]

Hi Gabriela, 

What version of AtoM are you using? And, are you developing a Bootstrap 2 theme, or attempting to develop a newer Bootstrap 5 theme?

Here are a few more resources that might help. First, we also have instructions in slide form, here: 

• https://www.slideshare.net/accesstomemory/creating-custom-themes-in-atom
  

These slides are also a bit older (so they are definitely only applicable for older Bootstrap 2 themes, not the newer BS5 templates we have begun introducing in release 2.7) and therefore I can't confirm they are totally up to date, but may still be more explicit in their steps than the docs. They link to an example theme available here: 

• https://github.com/sbreker/arDemoThemePlugin
  

I noticed in slide 9 the mention of creating a MakeFile that I don't see in the documentation? This may just be a step of convenience that one of our team added to their tutorial that the other didn't include, but still, worth checking out. 

Additionally, I am attaching a PDF that we deliver to clients when we create a new custom theme for them, but do not host them. It explains both how to install a plugin, as well as how AtoM theme plugins are typically structured, which again may hopefully help you sort out what's missing. Again, this is geared towards BS2 themes. 

Using these various sources as references, let's see if we can figure out what's different or missing: 

• Does the basic directory structure of your theme plugin match what is included in the attached PDF?
• Have you added your theme to the plugins directory of your AtoM installation?
• Did you create the configuration class PHP file, put it in the config directory of your theme plugin?
• Did you add that MakeFile mentioned above?
• Did you create a main.less file in the css directory of your theme?
• Does your main.less file include all the @imports needed from Bootstrap and the base Dominion theme, per this example? (Your custom CSS rules should go in that file as well)
• Did you install lessc and the other dependencies required to compile themes?

On this last point: these instructions are ONLY included in the Option 2 of our installation instructions (install from our GitHub repository), since we pre-compile the Dominion theme in the downloadable tarball used in Option 1. 

Here's what you'd need to install if you haven't, as described at the end of this section: 

sudo apt install npm make
sudo npm install -g "less@<4.0.0" n
sudo n stable
sudo npm install
sudo npm run build

Now we need to actually compile the theme - I am guessing that this might be the missing step... The command below is to compile the base Dominion theme. Run that, and then for your custom theme, repeat the command but use the path/name of your theme plugin instead to compile it: 

sudo make -C /usr/share/nginx/atom/plugins/arDominionPlugin

And finally, if you did everything listed above but still no changes are showing, did you try...

• Clearing the application cache?
• Restarting PHP-FPM?
• Clearing your web browser cache?

Hope this helps! 

Dan Gillean, MAS, MLIS
AtoM Program Manager
Artefactual Systems, Inc.
604-527-2056

@accesstomemory

he / him

--
You received this message because you are subscribed to the Google Groups "AtoM Users" group.
To unsubscribe from this group and stop receiving emails from it, send an email to ica-atom-user...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/ica-atom-users/09cf3020-ee46-484f-8e04-abb12648598fn%40googlegroups.com.

[Gabriela Cabañas]

Thank you! the command for compiling the theme was just what I needed