Return to previous page

CSS configurations - by Jarkko - on WordPress WooCommerce support

This topic has 5 replies, 2 voices, and was last updated 7 years, 2 months ago ago by Rose Tyler

Jarkko

Participant

February 19, 2017 at 12:07

Hi,

1) If you look on any product page like http://www.laatusuklaa.fi/tuote/georgia-ramon-haiti-80/ you can see the SKU, categories and keywords above the social media share buttons.

a) How can I change these links to behave the same (color, hover color, text-decoration) as normal links in the text? Now all other links are #917c27 but these remain dark brown.

b) How can I change the font size of the previously mentioned texts and links?

c) If you add this product to cart from this page, you get a small popup asking to continue shopping or checkout. In that popup the text “was succesfully added…” is for some reason aligned to the right side. How can I change it to start from the same (left) side as the product name above it, but still on a row of its own?

d) Is there a way to rearrange the social share buttons in to a different order?

2) On the front page http://www.laatusuklaa.fi/ a have a slider made with Slider Revolution. On each slide there appears a button in the center after a while and I have managed to make css changes to the buttons and text colors in Slider Revolution, but how do I change the HOVER text and button colors in that button for each slide?

Thank you!

#155179 Copied

4 Answers
Rose Tyler

Support staff

February 20, 2017 at 13:57
Hello,

1. Please, add this code in Custom CSS:
a)
```
.product_meta a {
    color: #917c27;
}
.product_meta a:hover {
    color: #917c27;
}
```
b)
```
.product_meta {
    font-size: 14px;
}
```
c) Have you changed some original theme files?
d) You can edit the file wp-content/themes/royal/framework/shortcodes.php (find the section “! Share This Product”). We recommend to make changes in the child theme http://codex.wordpress.org/Child_Themes not to lose modifications after theme update.

2. Please, use Slider Settings Style to change button: http://prntscr.com/eb33nn

Regards,
Rose Tyler.
#155234 Copied
Jarkko

Participant

February 20, 2017 at 16:22
1c: I have made changes to only these files and copied them to a child theme:
– content-grid.php
– functions.php
– headers/parts/top-bar.php

1d: Found it and changed the order but it doesn’t work. Was I supposed to do something else as well?
```
// **********************************************************************// 
// ! Share This Product
// **********************************************************************// 

add_shortcode('share', 'etheme_share_shortcode');
if(!function_exists('etheme_share_shortcode')) {
	function etheme_share_shortcode($atts, $content = null) {
		extract(shortcode_atts(array(
			'title'  => '',
			'text' => '',
			'tooltip' => 1,
	        'facebook' => 1,
			'twitter' => 1,
	        'google' => 1,
	        'pinterest' => 1,
	        'mail' => 1,
			'class' => ''
```
#155261 Copied
Jarkko

Participant

February 20, 2017 at 16:41

2: I don’t have the idle/hover selection visible at all…

#155267 Copied

Rose Tyler

Support staff

February 21, 2017 at 09:47

Hello,

1c. Please, update the theme to the latest version 2.9.
Before update delete “woocommerce” folder in the directory wp-content/themes/royal/ and it’ll be reuploaded from a new theme package.
Don’t forget to create back up of your files and database before starting update process!
https://youtu.be/KdWESIIPU1k
(it’s for Legenda theme but the process is the same).
1d. I’ve copied etheme_share_shortcode function to your function.php file in child theme and now you can change position of blocks http://prntscr.com/ebghka in this file

2. You need enable Layer Hover http://prntscr.com/ebgipt

Regards,
Rose Tyler.

#155356 Copied
Viewing 5 results - 1 through 5 (of 5 total)