Blog FAQ

FAQ 1:

How To Change Read More Button Text and Color in Blog:

(Note: button text color = color , button background color = background)

How To Change Color in Blog:

You can make changes in ‘ CSS ‘ for all versions either under A. Appearance -> Theme Editor -> Style.css file or B. Divi -> Theme Option -> General -> Custom CSS(If you have applied ‘Custom CSS ‘ as per the step mentioned in the installation guideline)

For Blog List Page:

For button text color:-

Go to Css Code -> /***Blog List V1***/ -> Line No: 19 (.blog_list_style_1 .et_pb_post a.more-link) -> color: #Enter your color code;

For button background color:-

Go to Css Code -> /***Blog List V1***/ -> Line No: 19 (.blog_list_style_1 .et_pb_post a.more-link) -> background: #Enter your color code;

For button text hover color:–

Go to Css Code -> /***Blog List V1***/ -> Line No: 20 (.blog_list_style_1 .et_pb_post:hover a.more-link) -> color: #Enter your color code;

For button background hover color:-

Go to Css Code -> /***Blog List V1***/ -> Line No: 20 (.blog_list_style_1 .et_pb_post:hover a.more-link) -> background: #Enter your color code;

For Blog Grid V1 Page:

Go to Css Code -> /***Blog Grid V1***/ -> Line No: 49
For hover color:-

Go to Css Code -> /***Blog Grid V1***/ -> Line No: 50

For Blog Grid V2 Page:

Go to Css Code -> /***Blog Grid V2***/ -> Line No: 60
For hover color:

Go to Css Code -> /***Blog Grid V2***/ -> Line No: 61

For Blog Fullwidth V1 Page:

Go to Css Code -> /***Blog Fullwidth V1***/ -> Line No: 281
For hover color:

Go to Css Code -> /***Blog Fullwidth V1***/ -> Line No: 282

For Blog Fullwidth V2 Page:

Go to Css Code -> /***Blog Fullwidth V2***/ -> Line No: 306

For Blog Timeline V1 Page:

Go to Css Code -> /***Blog Timeline V1***/ -> Line No: 162

For Blog Timeline V2 Page:

Go to Css Code -> /***Blog Timeline V2***/ -> Line No: 219
Similarly can do for all other versions

FAQ 2:

How To Change Read More Text in Blog:

Go to Divi -> Theme option -> Integration -> Add code to the < head > of your blog -> Add below js code
Note:
You can use any text in place of ” Enter Text Which You Want” in the code above to reflect same on your button.

FAQ 3:

In Blog Full Width V2 – Some Of The Blog Posts Moved Above or Below From The Position & Not Displaying Like Demo ?

Answer:
You can manage issue by modifying CSS For Specific Version :

We have kept CSS code for all version as ‘ Commented ‘ like for example “ /*****Blog Full width V2********/ “ under A. Appearance -> Theme Editor -> Style.css file or B. Divi -> Theme Option -> General -> Custom CSS(If you have applied ‘Custom CSS ‘ as per the step mentioned in the installation guideline)

Similarly you can find CSS for all Blog versions as ‘ commented ‘ by specific version name

Addressing Above Issue:
If you are importing ‘ JSON ‘ where you are utilizing your own blog posts(ie not on fresh installation) or adding blog version on existing site this issue can occur as it take default posts setting and can correct by modifying post property ie ‘ Posts Height / Width ‘ generally from CSS as needed’
In most of the case adjusting post ‘ Height ‘ will fix the issue and it can be set on – > line no 297

Just change height to fix issue and ideally default height is ‘ 222 px ‘

Code:
.blog-fullwidth-style-02 .et_pb_post {
        position: relative;
        width: 25%;
        float: left;
        margin-bottom: 0;
        cursor: default;
        height: 222px;
}

FAQ 4:

There is Issue with the ‘ Blog Version ’ content or images when updated it to latest version of Divi / WordPress for example ‘ Images / Blog Section ‘ acts weirdly on load or hover ?

Answer:
Sometime this issue occur depending upon whether your site have SSL or not and can install content fixer plugin below and activate to fix insecure content on the site:
https://wordpress.org/plugins/ssl-insecure-content-fixer/

FAQ 5:

For ‘ Masonry Blog Version ‘ on ‘ Hover ‘ blocks disappears or hovering effect have issue ?

Answer:
You need to add below css to overcome this problem

.masonary-style1 .et_pb_post {
backface-visibility: hidden;
}

.masonary-style1 .et_pb_post a img {
    width: 98%;
    margin-left: 1%;
    margin-top:1%;
}

You can write this in Custom CSS in Page Settings or Divi Theme Options.