#1  
Old 10-21-2019, 01:31 PM
GREENLAND MARKET's Avatar
GREENLAND MARKET is offline
 
Join Date: Oct 2019
Posts: 7
Smile

Little help with product CSS code


Hello,
I need some CSS help:

1. Change Title color for (recently viewed products)

2. Color for Title of (Random Product Widget)

3. Add Lines between (Product) (recently viewed products) & (Random Product Widget), or make them with borders.

4. For Product Page layout, I need to make:
One column NOT 2 columns
Breadcrumbs (With Title & background css color)
Product Name
Image
Product's description & all others (Options.. Price...)


Note: I used the Custom CSS Themes (It's not working):

#rvp-products .recently-viewed__name { color:#008080;font-size: 12px; }
#rvp-products .recently-viewed__price { color: #008080; }

&

div.ecwid-productBrowser-head {
color: red;
}

&

div.ecwid-productBrowser-categoryPath {
position: absolute;
top: 100px;
margin-left: -140px;
}


Thank you
  #2  
Old 10-22-2019, 10:27 AM
Anastasia E's Avatar
Anastasia E Anastasia E is offline
Ecwid Team
 
Join Date: Nov 2017
Posts: 63
Default

Hello!
My name is Anastasia, Ecwid Support. Thank you for contacting us! I will be glad to help you.

Here is the CSS code to change the Recently Viewed Products widget:
Code:
/*  Recently Viewed Products */
#rvp-products #rvp-products-wrapper .recently-viewed-title { color:#008080; font-size: 22px !important; }
#rvp-products #rvp-products-wrapper #recently-viewed-list .recently-viewed {  border: 2px solid #008080;}
Here is the CSS code to change the Random Product Widget:
Code:
/* Random Product Widget */
#random-products #random-products-wrapper .random-products__title { color: #008080; font-size: 22px !important; }
#random-products #random-products-wrapper #random-products__list .random-product { border: 2px solid #008080;}
Quote:
4. For Product Page layout, I need to make: One column NOT 2 columns
There are the following settings available for the Product Page layout:
  • 2 columns, product's description is on the right;
  • 2 columns, product's description is below the image;
  • 2 columns, product's description is on the left;
  • 3 columns.
You can manage them in your Ecwid control panel > Design > Product Page Layout.

Here is the CSS code to change the breadcrumps:
Code:
/* Breadcrumps */
.ec-size .ec-store .ec-link--muted, .ec-size .ec-store .ec-link--muted:visited { color: red; background-color: #d2d2e2; }
You can find more CSS codes for changing the elements on product pages in this article: https://support.ecwid.com/hc/en-us/a...oduct-page-0-2

Hope this helps. If you have any further questions — please, feel free to ask.

You can contact us at support@ecwid.com or on live chat via the "Get Help" menu in your Ecwid control panel.

Best regards,
Anastasia E.
Ecwid Support Team
The Following User Says Thank You to Anastasia E For This Useful Post:
Roy M Garver (07-25-2020)
 

Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT. The time now is 02:29 AM.
Powered by vBulletin® Version 3.8.11. Copyright ©2000 - 2020, Jelsoft Enterprises Ltd.