✨🎁 Get 25% Off on Orders Over $300! ✨ The discount will appear at checkout 🎁✨

Emerald Theme Documentation

A) Installation – top

1. Uploading

  1. Download the add-on
  2. Go to Admin panel > Add-ons > Manage Add-ons
  3. Click on [+] to open upload modal window
  4. Please choose whatever is comfortable to you:
    – Local: zip archive is saved on your computer
    – Server: zip archive is uploaded on your server
    – URL: you have a direct link to the zip archive
  5. After you selected the zip archive corresponding to your current version of CS-Cart please click Upload & install

2. License Activation

  1. Open add-on settings page Admin panel > Add-ons > Manage Add-ons >
    [TH] Emerald Theme Settings
  2. In Activation tab insert License key
  3. Save the settings and go back to Manage Add-ons page
  4. In same line with the name of the add-on, click Active
  5. Clear cache, choose Administration > Storage > Clear cache

3. Theme Activation

  1. Go to Admin panel > Design > Themes
  2. Click on tab Browse all available themes
  3. Hover “Emerald theme” and press Install button
  4. Then you can activate the theme in the Installed theme tab

That’s all, the theme is installed

The demonstration banners will be installed automatically

It is possible to use SVG logo in this theme

  1. Optimize SVG file, you can use online service SVGOMG!
  2. Open the file in a text editor and copy the text
  3. Go to Admin panel > Design > Layouts
  4. Deactivate block Logo
  5. Activate block Logo SVG
  6. Press [gear] and select Content tab
  7. Insert the text of your file between the lines 
    <a href="{""|fn_url}" title="{$logos.theme.image.alt}">
   svg code
</a>

SVG is a vector format, so scaling the image quality doesn’t deteriorate. Also when you add the SVG as described above, there is no additional request to the server.

To replace the logo on the image

  1. Go to Design > Themes
  2. Press Visual Editor in front of the currently active layout
  3. In the new tab, you will see your shop with Theme editor panel
  4. In CUSTOMIZE selector choose Logos
  5. After editing save your changes by pressing Save and press [X] to close editor

C) Change colors – top

  1. Go to Design > Themes
  2. Press Visual Editor in front of the currently active layout
  3. In the new tab, you will see your shop with Theme editor panel
  4. In CUSTOMIZE selector choose Colors
  5. After editing save your changes by pressing Save and press [X] to close editor

D) Change styles – top

Style files add-on should not be changed, this can lead to incorrect work of the add-on. If there was a need to redefine or add styles, please use Theme editor for this

  1. Go to Design > Themes
  2. Press Visual Editor in front of the currently active layout
  3. In the new tab, you will see your shop with Theme editor panel
  4. In CUSTOMIZE selector choose Custom CSS
  5. In textarea your can add your styles
  6. After editing save your changes by pressing Save and press [X] to close editor

E) Full-width section – top

You can easily make the section to full width

In grid settings added User-defined CSS class for section and Full width

For their appearance it is necessary to fulfill two conditions

  1. The grid has no parent
  2. Width – 16

Theme already has classes that specify background

  • .content_bg_section – Special background
  • .accent_bg_section – Main accent color

F) Category catalog – top

The number of columns on category page is set in the module settings

G) Blog – top

In the theme there is stylized add-on Blog by SIMTECH company included in the default CS-Cart

layouts_blog_emerald_theme.zip – this is a blog layout, to install it follow these steps

  1. Go to Design > Layouts > Gear next to the plus > Import layout
  2. In the opened window select Update current layout > Override locations by dispatch
  3. Upload the unzip file

The number of columns on the blog page is set in the add-on settings

K) Theme Update – top

Starting from version 3.19, updates are installed through the Upgrade center

Administration > Upgrade center

To upgrade to 3.19, follow these steps:

  • make a full backup of the store
  • close the store
  • install the theme add-on over the old version without removing the previous one
  • clear the cache
  • if necessary, make changes that can be erased during the upgrade if you changed the theme files directly
  • check that everything is successfully updated
  • open the store

To update language variables and add-on settings:

  • Go to developer mode
  • For this file local_conf.php add define(‘DEVELOPMENT’, true);
    If you do not have a file, create one.
  • Clear the cache
  • On the add-ons page in the drop – down list next to the add-on “[TH] Emerald Theme Settings” select “Update”
  • Return to normal store mode

For stores using color schemes created before the version 3.0

Updating the color scheme:
  • On the themes page, switch to the color scheme “Emerald”
  • Run the “Theme Editor””
  • Select your color scheme and save it.
  • The new color variables will be set to white. Replace them if necessary.
A subscription is required to access to product latest version and for technical support.

You can update alone or contact with us via support@themehills.com

Update layout to CS-Cart 4.10.1

Checkout_layout_for_4.10.1.zip – this is a Checkout layout, to install it follow these steps

  1. Go to Design > Layouts > Gear next to the plus > Import layout
  2. In the opened window select Update current layout > Override locations by dispatch
  3. Upload the unzip file

Theme update for CS-Cart 4.11.3

After the standard theme update process, you must change the color scheme
In the file design/themes/thin_theme/styles/data/<Your_color_scheme>.less
Add less variables:

//checkout
@checkout_selected_control_border: #4fbe31;
@checkout_control_border: #acbdcd;
@checkout_input_border: #acbdcd;
@checkout_selected_input_border: #4fbe31;
@checkout_step_title: #2e3a47;
@checkout_input_text: #2e3a47;
@checkout_input_label: #a1a6aa;
@checkout_control_background: #fff;
@checkout_selected_control_background: #fff;
@checkout_control_title: #4fbe31;
@checkout_control_description: #6c6c6c;
@checkout_control_label: #2e3a47;
@checkout_terms_background: #f9f9f9;

L) FAQ (Frequently asked questions) – top

  • How do I change the default vendor logo?

    Change the file design/themes/emerald_theme/media/images/logo.png to yours own and clear the cache.

Changelog

6.00 (18 Dec 2024)
Redesigned product grid layout
Added a new layout for the product grid (details on company YouTube channel)
Template fixes
Updated icon

5.01 (22 May 2024)
Fixes to styles and templates
Fixed a bug with the Product Video add-on

5.00 (18 Mar 2024)
Added support for Mega Wishlist
CSS fixes
The license system has been updated

4.10 (26 Jul 2023)
Fonts are hosted locally
4.17.1 support

4.09 (02 June 2023)
Fixed structure editor on frontend
Remove cmsmagazine meta tag

4.08 (03 Mar 2023)
Fixed a bug with the Call requests add-on

4.07 (02 Feb 2023)
Updated layouts for new installations of CS-Cart version 4.16.1
In old installations, when changing content in Smarty blocks, you need to create a new copy of it

4.06 (15 Jul 2022)
Fix in the license system
If you have www in your domain, and you don't see the new version in the update center, then install the new theme add-on on top of the old one (in a dangerous way - without erasing data in the database)

4.05 (04 Jul 2022)
The "Price per unit" add-on has been adapted
Updates in the license system (www ignored)
Fix in styles
Deleted:
/design/themes/emerald_theme/templates/views/products/quick_view.tpl
/var/themes_repository/emerald_theme/templates/views/products/quick_view.tpl

4.04 (21 Jun 2022)
Mandatory update for CS-Cart 4.15.1 and higher
Fixes in templates and styles
When updating manually, you need to delete these files:
/design/themes/emerald_theme/templates/common/product_data.tpl
/var/themes_repository/emerald_theme/templates/common/product_data.tpl
(it is better to update through the update center)

4.03 (25 Jan 2022)
Updated scripts 
Fix in styles

4.02 (10 Jan 2022)
Updated scripts 

4.01 (27 Sep 2021)
On the detailed product page, the image carousel (gallery) was replaced, from OWL to Swiper (for all types)
Fix in styles

3.20 (07 May 2021)
Fix in styles for RTL
Added to the login button in the vendor admin panel in the profile block

3.19 (08 Mar 2021)
Integrated the update system through the Upgrade center
Added new icon to the icon font: pinterest
	

3.18 (13 Jan 2021)
Fixed a bug with the login popup
Added the ability to display hover buttons in one column on the product card

3.17 (08 Dec 2020)
Updated the theme for compatibility with CS-Cart 4.12.1
You need to reinstall the add-on for CS-Cart Multivendor Ultimate

3.16 (30 Oct 2020)
Updated styles and templates
Fixed discount labels

3.15 (13 Jul 2020)
Added compatibility with the "Direct Customer-to-Vendor Payments" add-on

3.14 (24 Jun 2020)
Reduced the size of Google reCAPTCHA for my account panel
Improved styles

3.13 (15 Jun 2020)
Reduced the z-index for panels and pop-ups
Fix for Google geolocation

3.12 (04 Apr 2020)
Add sticky header for the desktop and mobile view when scrolling
Changed styles
Added module settings
Added language variables

3.11 (19 Mar 2020)
Fixed the arrows in the scroller
RTL fixes

3.10 (14 Feb 2020)
CSS fix for a detailed product page with a large picture
Changed the license system, if you have Multivedor Ultimate let us know before the update

3.09 (05 Feb 2020)
Added compatibility with CS-Cart 4.11.3
Modified file design/themes/thin_theme/styles/schema.json
and LESS files in the folder design/themes/thin_theme/styles/data

3.08 (26 Dec 2019)
Added new icons to the icon font: telegram and linkedin
	
	
Added new icons for payment systems: google pay and apple pay
	{include file="svg/pay_icons/apple_pay.tpl"}
	{include file="svg/pay_icons/google_pay.tpl"}
GDPR bug fixed

3.07 (07 Nov 2019)
Update for 4.11.1
Updated styles and templates

3.06 (17 Jul 2019)
Update for 4.10.3
(/design/themes/emerald_theme/templates/blocks/product_templates/default_template.tpl)
Updated layouts
Language variables updated

3.05 (14 Jul 2019)
Improved display of buttons on mobile view
Settings "Section full-width" moved to hook
Fixed bug in layouts

3.04 (02 Jul 2019)
Fix styles for labels, mobile filters, and scroller arrows

3.03 (11 Jun 2019)
Fixed buttons appearing when hovering over the item card

3.02 (10 Jun 2019)
Changed addon.xml - added CS-Cart version check
Fixed bug for quick view for 4.10.1
Updated layouts for Ultimate - changed the filter block

3.01 (03 Jun 2019)
Update to support 4.10.1
Fixes for RTL

3.0 (26 Jan 2019)
added style for Provider page (MV)
fixes for older versions of Safari
removed design/backend/templates/addons/ath_emerald_theme_settings/overrides/views/static_data / update.tpl
4 new color schemes
updated layouts for multivendor
fixes for rtl
style fixes

2.1 (06 Oct 2018)
fixed bread crumbs
added new display of filters without ajax
fixed buy buttons in one click and buy
changed extended menu
message if the theme module is disabled
changed priority
now the theme is not only in var, but also in desing

2.0 (13 Aug 2018)
added Multivendor support

1.7 (14 Mar 2018)
updated license to support Ultimate

1.5 (02 Dec 2017)
fixed a bug with my account

1.4 (31 Oct 2017)
mega menu support
Thin Theme support

Table of Contents

  1. Installation
  2. Change logo
  3. Change colors
  4. Change styles
  5. Full-width section
  6. Category catalog
  7. Blog
  8. Theme update
  9. FAQ (Frequently asked questions)
  10. Changelog
Product page
6.00 (2024-12-18)