πŸ’œ
storelocator
  • Overview
  • Installation
    • Setup Module
    • Extension Version Update
  • Config and Usage
    • Module Configuration Admin Site
    • Add Filter Tag’s and Categories
    • Add Storelocator
    • List StoreLocator at frontend page
    • Location Details Page
    • Run cron job to import storelocator items
    • Use couponcode for Lof Followup email
    • Use couponcode for Newsletter
    • How to use on frontend
    • Video Tutorial
    • FAQ
      • How to custom layout xml and template?
      • How to add content over slide image?
      • How to setup sample profile?
  • Other Module Guides
    • Magento 2 Step Recommendation
Powered by GitBook
On this page
  1. Config and Usage
  2. FAQ

How to setup sample profile?

PreviousHow to add content over slide image?NextMagento 2 Step Recommendation

Last updated 2 years ago

The Ves Image Slider extension we included a sample slider profile in the module package. You should download latest version of Ves Image Slider extension in our site:

Demo Sample Slider Profile:

Follow there steps to setup the sample slider profile:

Step1: Decompress the module package, then decompress the file β€œSample_Ves_ImageSlider_unzip.zipβ€œ. We will get the sample file and folders:

Step2: Go to admin > Venustheme > Setup > Import, then browse the sample JSON profile and click on button Import configuration

Step3: Upload folders: app/ and pub/ of sample profile into webroot folder of your site to override 2 folders in your site.

Step4: Clean cache of your site.

View the page: http://your domain/demo-ves-image-slider/

*Note: If the page not show the image slider, you should edit the cms page β€œDemo Ves Image Slider” in admin > Content > Elements > Page. Then edit the widget β€œCMS Block”, choose the cms static block β€œDemo Image Slider Widgetβ€œ, save the widget and save the cms page again.

TIP:

  • The static block β€œDemo Image Slider Widget” we are using widget shortcode as this:

<div>{{widget type="Ves\ImageSlider\Block\Widget\Sliders" addition_class="demo-slider-01" autoplay="1" autoplay_timeout="3000" autoplay_speed="900" nav_speed="800" dots_speed="800" autoplay_hover="1" dots="1" loop="1" touchdrag="1" mousedrag="1" pulldrag="1" block_1="custom_content" html_1="PGEgaHJlZj0iIyI+PGltZyBzcmM9Int7bWVkaWEgdXJsPSJ3eXNpd3lnL3Zlc19wYWdlYnVpbGRlci9ob21lMDEvc2xpZGVyc2hvdy8xLmpwZyJ9fSIgYWx0PSIiIC8+PC9hPgo8ZGl2IGNsYXNzPSJzbGlkZXJzaG93LWluZm8iPgo8aDM+VG9kYXkgU3BlY2lhbDwvaDM+CjxwPkFkZCBhIHN0eWxpc2ggdG91Y2ggdG8geW91ciBsaXZpbmcgc3BhY2U8L3A+CjxhIGNsYXNzPSJidXR0b24gYnRuIiBocmVmPSIjIj5TSE9QIE5PVzwvYT4KPC9kaXY+" block_2="custom_content" html_2="PHA+PGEgaHJlZj0iIyI+PGltZyBzcmM9Int7bWVkaWEgdXJsPSJ3eXNpd3lnL3Zlc19wYWdlYnVpbGRlci9ob21lMDEvc2xpZGVyc2hvdy8yLmpwZyJ9fSIgYWx0PSIiIC8+PC9hPjwvcD4KPGRpdiBjbGFzcz0ic2xpZGVyc2hvdy1pbmZvIj4KPGgzPlRvZGF5IFNwZWNpYWw8L2gzPgo8cD5BZGQgYSBzdHlsaXNoIHRvdWNoIHRvIHlvdXIgbGl2aW5nIHNwYWNlPC9wPgo8YSBjbGFzcz0iYnV0dG9uIGJ0biIgaHJlZj0iIyI+U0hPUCBOT1c8L2E+PC9kaXY+" block_3="custom_content" html_3="PHA+PGEgaHJlZj0iIyI+PGltZyBzcmM9Int7bWVkaWEgdXJsPSJ3eXNpd3lnL3Zlc19wYWdlYnVpbGRlci9ob21lMDEvc2xpZGVyc2hvdy8zLmpwZyJ9fSIgYWx0PSIiIC8+PC9hPjwvcD4KPGRpdiBjbGFzcz0ic2xpZGVyc2hvdy1pbmZvIj4KPGgzPlRvZGF5IFNwZWNpYWw8L2gzPgo8cD5BZGQgYSBzdHlsaXNoIHRvdWNoIHRvIHlvdXIgbGl2aW5nIHNwYWNlPC9wPgo8YSBjbGFzcz0iYnV0dG9uIGJ0biIgaHJlZj0iIyI+U0hPUCBOT1c8L2E+PC9kaXY+"}}</div>
  • The cms page β€œDemo Ves Image” we should add custom layout xml as this to load sample css file (you can load sample css file of the module by layout xml in your custom theme):

<head>
	<css src="Ves_ImageSlider::css/sample.css" />
        <css src="//maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css" src_type="url"/>
</head>

1. CMS Page β€œDemo Image Slider Widget”:

2. CMS Static Block β€œDemo Ves Imageβ€œ:

http://landofcoder.com/
http://newdemo.demo4coder.com/m2/demo-ves-image-slider/