Add background to Sidebar Widget title and more

Sparkling
1

Hello Aigars, thanks for your continuous support, how was snowboarding?

  1. I wish to add background colour to my widget titles at the sidebar.

  2. I also wish to add my blog archive link below my poplular post widget.

  3. How to remove the calendar art from the date.

  4. On blog page, I wish to add category post meta to the excerpt, which will be on the same line to the left of “Read more” below the post excerpt. Both carrying one border above and below.

  5. Also I wish to remove the encircling square around the 3 horizontal line “menu bar” on mobile view.

  6. I wish to change the my post title and widget title (sidebar and footer)only to uppercase.

  7. Lastly, I want the font size of my “content” and “single.content” to differ. Is this possible?

Thanks

2

@tobi,

Had a great time doing off-piste snowboarding as well as some snowpark action. Awesome! :slight_smile:

Please post your website URL, so I can see current state of your website as you have been working on it for so long and many thing might not work just like they are on theme demo.

3

Sound like a lot of fun!

This is my website: www.tobiraphael.net.

Thanks.

4

I’ve figure out #1. But I have 6 more modifications waiting. Thanks

5
  1. You can edit popular posts widget by going to sparkling/inc/widgets/widget-popular-posts.php and try to add your URL code right above this line of code:

</div> <!-- end posts wrapper →

  1. You can remove calendar icon from post date by adding this code to Appearance >> Theme Options >> Other >> Custom CSS:
.entry-meta .fa.fa-calendar {
  display: none;
}
  1. Add this code inside content.php file below function called the_content 
<?php
	/* translators: used between list items, there is a space after the comma */
	$categories_list = get_the_category_list( __( ', ', 'sparkling' ) );
	if ( $categories_list && sparkling_categorized_blog() ) :
?>
<span class="cat-links"><i class="fa fa-folder-open-o"></i>
	<?php printf( __( ' %1$s', 'sparkling' ), $categories_list ); ?>
</span>
<?php endif; // End if categories ?>

Most likely it will require some extra styling but that’s completely up to you.

  1. You can remove border around navigation toggle on mobile devices by adding this code to Appearance >> Theme Options >> Other >> Custom CSS
.navbar-default .navbar-toggle {
  border-color: transparent;  
}

  1. They are uppercase already or I am missing something?

  2. You can change font size for blog pages and single post view like this. First value is for single post and second one is for archive and blog/home page

.single .entry-content {
  font-size: 20px;
}
.home .entry-content,
.archive .entry-content {
  font-size: 25px;
}