Caprica themes :- Prestashop PRS050102 Theme Help
Thank you for purchasing theme from Caprica themes.
Contents |
1. Installation Top
Theme installation steps:
There are two methods for installing theme:
Method 1:
Log in to your site Prestashop Admin panel, Go to Design > Theme & Logo.
Now click on "Add new theme" to add theme.
After that upload "PRS050102_Installer.zip" (Provided in our Theme Package) in "IMPORT FROM YOUR COMPUTER" section as shown below and click on "Save" button.
Method 2:
Upload theme folders: img,modules and themes provided in our theme folder Prestashop Files_v1.7.x from appropriate FTP Client as shown below.
2. Activate Theme Top
Now to activate theme on your site from admin panel, Go to Design > Theme & Logo. Select our theme "PRS050102" by clicking on "Use this theme".
3. Caprica themes Module Settings Top
Now you need to install few modules which will enhance your store and make it look like our live demo.Go to Modules > Modules click on Other Modules tab and install all the modules provided by Caprica themes.
1) CT - Image Slider
CT - Image Slider. Click on "Configure".
Install and Configure this module to display Left Banner.
Install and Configure this module to display second image on prodcut hover.
Install and Configure this module to display featured product.
Install and Configure this module to display new product.
Install and Configure this module to display special product.
Install and Configure this module to display special product in sidebar.
CT- Brand Logo "Install" and "Configure".
CT - Category Product Slider . Click on "Configure".
Add Category For Slider.
Upload image for Category
After that Click on "Save" button.
See the below screenshot
CT - Testimonial Block "Install" and "Configure".
Click on Source code button display in screen shot and paste below HTML code for CT - Testimonial Block and click on Source code button.
HTML code for CT - Testimonial Block<ul id="testimonial-carousel" class="ct-carousel product_list">
<li class="item">
<div class="image-block"><img alt="user1.jpg" src="img/cms/user1.jpg" /></div>
<div class="content">
<div class="description">There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable.</div>
<div class="post-author"><a href="#">Mark Jefferson / </a><span class="post">Manager</span></div>
</div>
</li>
<li class="item">
<div class="image-block"><img alt="user2.jpg" src="img/cms/user2.jpg" /></div>
<div class="content">
<div class="description">There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable.</div>
<div class="post-author"><a href="#">Mark Jefferson / </a><span class="post">Manager</span></div>
</div>
</li>
<li class="item">
<div class="image-block"><img alt="user3.jpg" src="img/cms/user3.jpg" /></div>
<div class="content">
<div class="description">There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable.</div>
<div class="post-author"><a href="#">Mark Jefferson / </a><span class="post">Manager</span></div>
</div>
</li>
</ul>
</div>
After that Click on "Save" button.
CT - Service CMS Block "Install" and "Configure".
Click on Source code button display in screen shot and paste below HTML code for CT - Service CMS Block and click on Source code button.
HTML code for CT - Service CMS Block<h2 class="h1 products-section-title">Welcome To Our Store</h2>
<div class="service-left">
<div class="service-1 service"><span class="service1-icon icon"></span>
<div class="service-content">
<div class="content-title">Free Delivery</div>
<div class="content-desc">There are many variations of Lorem Ipsum available but the majority...</div>
</div>
</div>
<div class="service-2 service"><span class="service2-icon icon"></span>
<div class="service-content">
<div class="content-title">Best Quality</div>
<div class="content-desc">There are many variations of Lorem Ipsum available but the majority...</div>
</div>
</div>
</div>
<div class="service-right">
<div class="service-3 service"><span class="service3-icon icon"></span>
<div class="service-content">
<div class="content-title">Coffee Supply</div>
<div class="content-desc">There are many variations of Lorem Ipsum available but the majority...</div>
</div>
</div>
<div class="service-4 service"><span class="service4-icon icon"></span>
<div class="service-content">
<div class="content-title">Online Support</div>
<div class="content-desc">There are many variations of Lorem Ipsum available but the majority...</div>
</div>
</div>
</div>
</div>
After that Click on "Save" button.
CT - CMS Block "Install" and "Configure".
Click on Source code button display in screen shot and paste below HTML code for CT - CMS Block and click on Source code button.
HTML code for CT - CMS Block<div class="cmsbanner-1 cmsbanner">
<div class="img"><a href="#"><img src="img/cms/cms-banner.jpg" alt="banner1.jpg" /></a></div>
<div class="content-outer">
<div class="content">
<div class="title">Grab This Best Discounts</div>
<div class="heading">Espresso Coffer Beans</div>
</div>
</div>
</div>
</div>
After that Click on "Save" button.
CT - Footer CMS Block "Install" and "Configure".
Click on Source code button display in screen shot and paste below HTML code for CT - Footer CMS Block and click on Source code button.
HTML code for CT - Footer CMS Block<div class="block_about">
<div class="toggle-footer">
<div class="footer_logo"><a href="#"><img src="img/cms/footer-logo.png" alt="footer logo" /></a></div>
</div>
</div>
</div>
<div class="content-right">
<h3 class="title">About Coffee Shop</h3>
<div class="description">All the Lorem Ipsum generators on the Internet tend to repeatThere are many variations of passages of LoremIpsum predefined necessary.</div>
</div>
After that Click on "Save" button.
Install and Configure this module to display instragram images.
4. Blog Settings Top
Go to Modules > Modules click on upload a module at Top right corner.Upload psblog module from theme package.
Edit default setting from Backoffice -> Ps Blog Management
Edit listing blog setting from Backoffice -> Ps Blog Management
Edit item blog setting from Backoffice -> Ps Blog Management
5. Image Settings Top
Our live demo uses the following image sizes for product in product information page.So it’s suggested to edit a product image size parameter named.
Go to Design > Image Settings and update image size for your store.
See below screen shot.
