Return to previous page

CSS Questions - by adaezetula - on WordPress WooCommerce support

This topic has 17 replies, 3 voices, and was last updated 8 years, 1 months ago ago by Eva Kemp

adaezetula

Participant

March 13, 2016 at 02:07

I have a few more questions involving CSS that I can’t find in the CSS file:

1. What CSS can I use to hide the dotted border (and the quote mark above the social icons) around the cart and social icons in my header?

2. What CSS can I use to hide the newsletter and grey border at the top of my header?

3. What CSS can I use to hide the thin lines in between each menu item in the menu bar?

4. What CSS can I use to change the menu upon hovering from yellow to #6e86a1?

Also, the search bar in my header does not seem to work or search anything. I click it and nothing happens.

Thanks

#117178 Copied

16 Answers

adaezetula

Participant

March 13, 2016 at 02:34

I fixed the search bar!

#117179 Copied
Eva Kemp

Support staff

March 14, 2016 at 11:04
Hello,

1. Please add this code in Theme Options > Custom CSS > Global Custom CSS:
```
.header-type-7 .header .tbs span, .shopping-cart-widget {
   border: none !important;
}
.header-type-7 .header .tbs span::before {
    content: none;
}
```
2. Go to Theme Options > Header > Enable top bar > Off.

3. Use this code in Global Custom CSS:
```
.header-type-7 .menu-wrapper .menu-main-container > ul > li > a {
    border-left: none !important;
}
.header-type-7 .menu-wrapper .menu-main-container > ul > li:last-child > a {
    border-right: none !important;
}
```
4. Use this css code:
```
.menu > li > a:hover {
   color: #6e86a1 !important;
}
```
Regards,
Eva Kemp.
#117270 Copied
adaezetula

Participant

March 14, 2016 at 19:56

Thanks! All of those worked except #2. There’s still a slight grey border.

Also, how do I create sections in the footer like the Cleopatra footer? Everything I put in the widgets is just stacked on top of each other.

Thanks so much!

#117401 Copied

Eva Kemp

Support staff

March 14, 2016 at 20:07

Hello,

You need to create footer using Static Blocks as described in our documentation:
https://www.8theme.com/demo/docs/royal/#!/9_footer

I’ve disabled top bar in Theme Options > Header > Enable top bar > Off. Check it now.

Regards,
Eva Kemp.

#117402 Copied

adaezetula

Participant

March 21, 2016 at 16:40

On the single product page, I cannot figure out how to remove the sidebar. I have disabled it in the Theme Options for the Single Product Page as well as the on the Product Page Layout and it’s still there.

How can I continue my image from the menu bar onto sub menu items instead of having the white background?

Where can I change the links associated with the header’s top left social media icons so when the user clicks them they go to a specific social media page?

Lastly, how can I remove the Home/Shop/Necklaces when I select a shop category directly below the header? You can see what I mean when you click the website link provided.

Thanks!

#118309 Copied
Jack Richardson

Support staff

March 21, 2016 at 17:01
Hello,

As you created a separate page and added shortcode to display products, then the settings from Theme Options won’t work. To disable sidebar there you need select “Without Sidebar” for “Sidebar Position” field http://storage2.static.itmages.com/i/16/0321/h_1458575304_6868350_f48993b94a.png .

Concerning the menu please add this code in Global Custom CSS:
```
.header-type-7 .menu-wrapper .menu-main-container > ul .nav-sublist-dropdown {
    background: #f9f8f8 url("http://scollectionshop.com/wp-content/uploads/2016/03/6fb9863626801cbd61aa474503be909c.png");
}
```
To change social icons links you need edit the file wp-content/themes/royal/framework/shortcodes.php (find the section “! Share This Product” in line 1918), to change links you need edit the code, for example for Twitter <a href="https://twitter.com/share?url='.$permalink.'&text='.$post_title.'" class="'.$tooltip_class.'" title="'.__('Twitter', ETHEME_DOMAIN).'" target="_blank"> and replace https://twitter.com/share?url='.$permalink.'&text='.$post_title.' with a link to your Twitter account.

To remove breadcrumbs use this code in Global Custom CSS:
```
.page-heading .breadcrumbs {
   display: none;
}
```
Best regards,
Jack Richardson.
#118313 Copied
adaezetula

Participant

March 21, 2016 at 17:10

Oh okay. So, wouldn’t the categories show up as a menu item I can just add to the menu instead? A previous user created those pages, I’d just like to add a link to the menu straight to the categories, but it doesn’t show up when I customize the menu.

Thanks!

#118314 Copied

Jack Richardson

Support staff

March 21, 2016 at 17:45

Hello,

To add Product Categories to menu go to Appearance > Menus > open “Screen Options” window at the top and tick “Product Categories”, then you’ll see categories list.

Best regards,
Jack Richardson.

#118322 Copied

adaezetula

Participant

March 21, 2016 at 18:32

Thanks. Does the shortcakes.php change the actual product page or the social links at the header? The header social links is what i’d like to change.

And, where can I change the font on the menu’s submenu to match the main menu?

My menu also repeats itself in the non-fixed menu when I navigate down the page. How can I fix that?

Thanks!

#118327 Copied
Jack Richardson

Support staff

March 21, 2016 at 18:43
Hello,

All links where you’re using [share] shortcode will be changed.

To change submenu items font use this css code:
```
.menu .nav-sublist-dropdown ul > li > a {
    color: #f2f2f2 !important;
    font-family: Droid Serif !important;
}
```
To remove repeating menu go to Appearance > Menus > Manage Locations > deselect Main Menu (right) http://storage9.static.itmages.com/i/16/0321/h_1458582222_9660769_01f0b33ab9.png .

Best regards,
Jack Richardson.
#118329 Copied
adaezetula

Participant

March 22, 2016 at 18:19

Thank you.
If you select “do not show again” on the popup, how can you view it to unselect it and continue seeing it multiple times?

I cannot see it anymore when I access my page

#118485 Copied

Eva Kemp

Support staff

March 22, 2016 at 18:23

Hello,

Try to clear browser cache and cookies and check your site after that.

Regards,
Eva Kemp.

#118488 Copied

adaezetula

Participant

March 22, 2016 at 18:27

I did, still don’t see it. I know it can be shown at the top bar, but I don’t want it to show up there.

#118489 Copied

Eva Kemp

Support staff

March 22, 2016 at 19:43

Hello,

Sorry, but to get popup window shown you have to enable top bar.
This is how it works.

Regards,
Eva Kemp.

#118501 Copied

adaezetula

Participant

March 22, 2016 at 19:58

So you’re saying after someone clicks “do not show again” the pop up is unable to refresh and show again after the user visits the site after a day or a week?

#118503 Copied

Eva Kemp

Support staff

March 22, 2016 at 20:08

Hello,

The popup will be shown after browser cookies are cleared.
But now you have disabled top bar and in this case popup window won’t load.
Try to enable top bar in Theme Options and check site again.

Regards,
Eva Kemp.

#118504 Copied
Viewing 17 results - 1 through 17 (of 17 total)