Hristo Georgiev
asked 8 years ago

Hi,
We try to find where is the code to put the color value in the category column.
Once added the category have white background. We would like to change the background color in category, but change only in the exact added category.
Thanks!

5 Answers
DominicStaff
answered 8 years ago

Hello Hristo !
Please send me your site, We will help you change the background in the categories on the DW Focus.

DominicStaff
answered 8 years ago

Hi Hristo ! When post a new question, you can click the Insert/ edit image on the MceToolbar and insert an image. See the screenshot:
Also, Please send me your site for further checking.
Hope this helps !

DominicStaff
answered 8 years ago

Hi Hristo !
You can  use the Imgur  for upload a screenshot then send me your link to image.
 

Hristo Georgiev
answered 8 years ago

Hi,
please check the images and give me the instructions how to change it.
for help
Thanks!

DominicStaff
answered 8 years ago

Hi Hristo !
I can not find your image anywhere. Please check again.

DominicStaff
answered 8 years ago

Hi ! 1. To change the background color of the DW Focus: Headeline widget, you log in to Dashboard > Appearance > Customize > General Setting, add the following code to the Header Script:

<style>
.under-navigation {
     background: #...;
     color: #...;
}
.under-navigation .widget-title {
      color: #...;
}
.under-navigation li a {
      color:#...;
}
</style>

– To change the first image in the category, You can add the following code to the Header Script

<style>
.archive .content-inner.layout-grid .hentry:first-child .entry-thumbnail, .archive .content-inner.layout-grid .hentry:first-child .entry-thumbnail img {
    height: 218px;
    margin-right: 15px;
    width: 365px;
}
</style>

/*change background content bar*/

<style>
.content-bar {
    background: #...;
}

.page-title {
   color: #fff;
}
.archive .post-layout a {
color:#...;
}
.archive.color-category .post-layout a.active {
background: #...;
border-color: #...;
}
</style>

2. 3. To change background for each categories on the home page in the DW Focus, You can log in to Dashboard > Posts > Categories, then select  the category style (e.g: Green/ Blue ) + To change background for the category style: blue

<style>
.widget.news-category .color-blue.category-title{
    background:  #...;
    color: #.....;
}
</style>

Notice: If you want to change another category, You just need replace the name of category style in the line code (E.g: green / yellow / orange / violet / blue / cyan ) :

.widget.news-category .color-blue.category-title {}

+ To change the Text  color in the category (E.g: All / Movies / Music / TV), You can add the following code:

<style>
.widget.news-category .child-category a {
    color: #....;
}
.widget.news-category .child-category a.active, .widget.news-category .child-category a:hover {
    color: #...;
}
</style>

– If you want to change the background for all categories, You can add the following code to the Header Script:

<style>
.widget.news-category .category-title {
background: #...;
}
.widget.news-category .child-category a {
    color: #....;
}
.widget.news-category .child-category a.active, .widget.news-category .child-category a:hover {
    color: #...;
}

</style>

Hope this helps !

Kido D
answered 8 years ago

Hi Hristo,

To add the thumbnails for each post, please follow the steps here:
1) Open up the dw-focus-categories.php file in themes/dw-focus/widgets folder, find the code below (around line 290):

<li><h2 class="entry-title"><a href="<?php the_permalink(); ?>" title="<?php echo esc_attr( sprintf( __( 'Permalink to %s', 'dw_focus' ), the_title_attribute( 'echo=0' ) ) ); ?>" rel="bookmark"><?php the_title(); ?></a></h2></li>

.. and change it into this:

<li>
<?php if( has_post_thumbnail( get_the_ID() ) ) { ?>
<div class="entry-thumbnail">
<a href="<?php the_permalink(); ?>" title="<?php echo esc_attr( sprintf( __( 'Permalink to %s', 'dw_focus' ), the_title_attribute( 'echo=0' ) ) ); ?>" rel="bookmark"><?php the_post_thumbnail(array(50,50)); ?></a>
</div>
<?php } ?>
<h2 class="entry-title"><a href="<?php the_permalink(); ?>" title="<?php echo esc_attr( sprintf( __( 'Permalink to %s', 'dw_focus' ), the_title_attribute( 'echo=0' ) ) ); ?>" rel="bookmark"><?php the_title(); ?></a></h2>
</li>

2) Go to Dashboard / Appearance / Customize / General Setting, and add the following code to the Header Code section:

<style>
.widget.news-category .other-entry li {clear:both;}
.other-entry .entry-thumbnail {float: left;}
.widget.news-category .other-entry h2 {margin-left: 60px;}
</style>

Hope this helps!

Powered by DW Question & Answer Pro