How to add background image to DIVI secondary nav

Use this code in custom css field of theme optio:

.et_fixed_nav #top-header {
background-image: url(Image url Here);
}

Read More

DIVI Mobile Menu Custom Style

This will increase the size of DIVI mobile menu (hamburger icon) and make the bars white.

Add this custom CSS code to your DIVI theme menu:

@media (min-width: 980px) {
.et-fixed-header#main-header {
background-color: #000 !important;
}
}
@media (max-width: 980px) {
.et-fixed-header#main-header {
background-color: transparent;
}
}
@media (max-width: 980px) {
.et-fixed-header .logo_container {
display: none;
}
}

Read More

Make the DIVI mobile menu icon Sticky

 To make the DIVI mobile menu icon Sticky add this custom CSS:


.et_header_style_left .mobile_menu_bar {
padding-bottom: 0px !important;
background: #000 !important;
}
.mobile_menu_bar {
position: fixed;
}

Read More

Hide users Ip Address shown on profile with Vanilla Forums

These is only usually shown to admins but if you wish to disable this altogether on your Vanilla install. Use this custom CSS:

    .MItem.IPAddress {
        display: none
    }

Read More

How to hide the Vanilla Forums Recent Discussion tab when on that page

This handy CSS snippet that can be added to your custom CSS file of Vanilla Forums will hide the Recent Discussions link on the sidebar when you are viewing the Recent Discussions page.

.Section-DiscussionList .FilterMenu .Discussions {
    display: none;
}

Read More

DIVI Theme Accent color over-rides WooCommerce buttons

If you use the WordPress DIVI theme with WooCommerce, then perhaps you have noticed the style of the buttons have changed.

This CSS snippet is all you need to fix the issue.

.woocommerce .button {
background:red !important;
color: #fff !important;
}

Read More

How to change your subreddit name to an image with CSS

To changes your reddit's name (at the top) to an image. You must include the dimentions
you want your image to be.
 
.redditname a{
background:url(IMAGE);
height: ??px;
width: ??px;}

#header-bottom-left{
height: ??px;}

.redditname a{
text-indent:-9001px;
}

#header-img-a,
.redditname a,
.tabmenu {
display: inline;
float: left;}

.tabmenu{
position:relative;
top:100%;
margin-top:-16px!important;}

You can view an example of the Reddit CSS Stylesheet here.

Read More

Hide the downvote arrow on Reddit subreddit

You can customize your sub-reddit page with CSS. To hide the downvote arrow, simply enter this CSS code:

.arrow.down {
visibility: hidden;
display: none
}

You can view an example of the Reddit CSS Stylesheet here.

Read More

Increase padding of WooCommerce image

You may find you need to increase the padding on a WooCommerce products pages with the DIVI theme. You can try this CSS code here here:

.single-product section.related.products {
    clear: both;
    padding-top: 20px;
}

Read More

How to hide the DIVI secondary menu before scroll

You can remove the secondary menubar before scrolling with this CSS snippet below. This will make the primary menu bar visible before scrolling, but the secondary bar only available when scrolled.

The custom CSS code is:

.et_fixed_nav #top-header {
visibility: hidden;
}

.et_fixed_nav #top-header.et-fixed-header {
visibility: visible;
}

Read More

How to remove comments on DIVI Projects with CSS

 
To remove comments with CSS on the DIVI theme, just add this code in theme option's custom css:
 

.single-project #comment-wrap{
display:none;
}

Read More