[opencms-dev] Activating Revolution Slider

[Alexander Kandzior]

Hi Bernhard,

last Friday I pushed an update for the Mercury template to Github https://github.com/alkacon/mercury-template <https://github.com/alkacon/mercury-template>.
I made some changes in that update that makes enabling the Revolution Slider easier.

You should rebase / merge this update with your branch first, otherwise the instructions here don’t work.

After the update, you need to enable the revolution slider in the JavaScript (the quick and dirty way):

* In the /package.json file, in „scripts" rename the key "css-plugins“ to "css-plugins-original“, then rename the key "css-plugins-revslider“ to "css-plugins“.
* In the file /template-src/js/mercury.js in line 811, change the "if (false)“ to "if (true)“
 
Then create the javascript by running „npm run js“.

After this you will find the generated JavaScripts in /build/npm/js.
There should be 2 new files: "mercury-slider-rev.js“ and  "mercury-slider-rev.map“.

You need to copy the generated files into OpenCms /system/modules/alkacon.mercury.theme/js/.
Make sure to copy all files, not just the 2 new ones.
Now you have the required Javascript available.

You also need to create the CSS by running „npm run css“.
After this you will find the generated CSS in /build/npm/03_minified.
Here you need to copy the files „base.min.css“ (.map) into OpenCms /system/modules/alkacon.mercury.theme/css/, replacing the existing file.
The new file should be larger, as ist contains a lot of extra CSS required by the revolution slider. 


Next step is to tell the OpenCms sitemap configuration to enable the „Complex Slider“ type (which is using the Revolution Slider JavaScript).
Open the file /.content/.config for your site in the OpenCms form editor.

* On the tab „Content elements“, click the plus right to „Content element configuration“.
For „Type name“ select „m-slider-complex“.
For „Disabled“ select „false“.

* On the tab „Formatters“, click the plus right to „Formatters to be added“.
For „Formatter“ select „Complex slider [m-slider-complex]“.


Now switch to the OpenCms page editor and click the „Add content“ button.
In the view „Advanced elements“ you should now see the „Complex slider“ element.

Drag & Drop a new element to your page and edit the content, adding 2 images.
If the images are displayed and rotate it works.


Kind regards,
Alex.

-------------------
Alexander Kandzior

Alkacon Software - The OpenCms Experts                                                    
http://www.alkacon.com - http://www.opencms.org                                                          


> Am 20.05.2019 um 15:52 schrieb Bernhard Zebedin <bernhard.zebedin at visions2.net>:
> 
> ​Dear Alex.
> I have the mercury template ready for build. (On Windows IntelliJ)
> It works so far fine....
> There exists some problems on standard build on windows... but I fixed it for me...
> The only thing is.... how to include correctly js and css... I need some small hints...
> npm build is a little bit new for me...
> 
> kr
> Bernhard
> Von: opencms-dev-bounces at opencms.org <mailto:opencms-dev-bounces at opencms.org> <opencms-dev-bounces at opencms.org <mailto:opencms-dev-bounces at opencms.org>> im Auftrag von Alexander Kandzior <alex at opencms.org <mailto:alex at opencms.org>>
> Gesendet: Freitag, 17. Mai 2019 13:47
> An: The OpenCms mailing list
> Betreff: Re: [opencms-dev] Activating Revolution Slider
>  
>> Does anybody know how to activate the revolution slider in the new mercury template?
> 
> I do know how it’s done but unfortunately it’s quite difficult.
> 
> The problem is that the CSS and JS for Mercury shipped by default do not contain the required classes / scripts for the revolution slider anymore.
> 
> Even if you activate the "Complex slider" element from the „alkacon.mercury.xtensions“ module by configuring the sitemap .config file, it won’t work because the CSS/JS is not there.
> 
> The only good news is that the required CSS / JS is still available in Github https://github.com/alkacon/mercury-template <https://github.com/alkacon/mercury-template>.
> 
> If you are comfortable checking this out and rebuild the CSS / JS yourself to enable the rev slider enabled I can walk you through this.
> It’s not that hard if you are on Linux and somewhat familiar with npm builds.
> So let me know if you want to do it this way.
> 
> Kind regards,
> Alex.
> 
> -------------------
> Alexander Kandzior
> 
> Alkacon Software - The OpenCms Experts                                                    
> http://www.alkacon.com <http://www.alkacon.com/> - http://www.opencms.org <http://www.opencms.org/>                                                          
> 
> 
>> Am 17.05.2019 um 07:44 schrieb Bernhard Zebedin <bernhard.zebedin at visions2.net <mailto:bernhard.zebedin at visions2.net>>:
>> 
>> Der all.
>> Does anybody know how to activate the revolution slider in the new mercury template?
>> ​Thanks a lot
>> Bernhard
>> 
>> PS: OpenCMS 11 is amazing
>> _______________________________________________
>> This mail is sent to you from the opencms-dev mailing list
>> To change your list options, or to unsubscribe from the list, please visit
>> http://lists.opencms.org/cgi-bin/mailman/listinfo/opencms-dev <http://lists.opencms.org/cgi-bin/mailman/listinfo/opencms-dev>
>> 
>> 
>> 
> 
> _______________________________________________
> This mail is sent to you from the opencms-dev mailing list
> To change your list options, or to unsubscribe from the list, please visit
> http://lists.opencms.org/cgi-bin/mailman/listinfo/opencms-dev <http://lists.opencms.org/cgi-bin/mailman/listinfo/opencms-dev>
> 
> 
> 

-------------- next part --------------
An HTML attachment was scrubbed...
URL: <https://webmail.opencms.org/pipermail/opencms-dev/attachments/20190520/a825d70d/attachment.htm>