• Skip to primary navigation
  • Skip to main content
  • Skip to primary sidebar

WordPress Tips, Code Snippets, and How To Tutorials

  • Home
  • Blog
  • Tips
  • Snippets
  • Tutorials
  • Contact

Code Snippets

How to change the color of links when you hover over them using CSS in your WordPress theme

October 26, 2019 by admin Leave a Comment

If you are using WordPress for your website, you may want to change the color of the links on your website when someone uses the mouse to hover over it. Just add this a:hover WordPress Code Snippet to your CSS stylesheet in your current WordPress theme in order to change the color of links when hovered over in WordPress.

/**
 * Change link color on hover
 *
 * @author WPSnacks.com
 * @link https://www.wpsnacks.com
 */
a:hover {
	 color: #000000;
}

Just replace #000000 with the hex color code that you want to use for links. Your theme may likely already have the link color hover listed in the CSS stylesheet so you may want to search the stylesheet for that first and if it does then you can update the hex color code to the one you want. Hope this helps with your WordPress problem, enjoy.

If you like this then you should look up more of our WordPress Tips Code Snippets and Tutorials.

Disclosure: There are affiliate links on posts and throughout the website and if you use the links to make a purchase we may earn a commission from it. We link to these companies and their products because of the quality of the companies and not because of the commission we may receive from it.

Disclaimer: The information contained in this website is for general information purposes only and in no event will this website or its owners be liable for any losses or damages associated with your use of our website or content. We recommend that you make a backup of your website before you make updates to it. Click here to see our full Disclaimer.

Filed Under: Code Snippets Tagged With: Color, CSS, Formatting

How to change the color of links using CSS in your WordPress theme

October 26, 2019 by admin Leave a Comment

If you are using WordPress for your website, you may want to change the color of the links on your website. Just add this WordPress Code Snippet to your CSS stylesheet in your current WordPress theme in order to change the color of links in WordPress.

/**
 * Change link color
 *
 * @author WPSnacks.com
 * @link https://www.wpsnacks.com
 */
a {
	 color: #000000;
}

Just replace #000000 with the hex color code that you want to use for links. Your theme may likely already have the link color listed in the CSS stylesheet so you may want to search the stylesheet for that first and if it does then you can update the hex color code to the one you want. Hope this helps with your WordPress problem, enjoy.

If you like this then you should look up more of our WordPress Tips Code Snippets and Tutorials.

Disclosure: There are affiliate links on posts and throughout the website and if you use the links to make a purchase we may earn a commission from it. We link to these companies and their products because of the quality of the companies and not because of the commission we may receive from it.

Disclaimer: The information contained in this website is for general information purposes only and in no event will this website or its owners be liable for any losses or damages associated with your use of our website or content. We recommend that you make a backup of your website before you make updates to it. Click here to see our full Disclaimer.

Filed Under: Code Snippets Tagged With: Color, CSS, Formatting

How to hide result count display in WooCommerce in WordPress

May 3, 2016 by admin Leave a Comment

If you are using WooCommerce for an online store on your WordPress site, you may want to hide the result count “showing the single result” or however many products you display on your Shop page and other product archive pages. Just add this WordPress Code Snippet to your CSS stylesheet in your current WordPress theme in order to hide the product result count display on product archive pages in WooCommerce.

/**
 * Hide WooCommerce Product Result Count Display
 *
 * @author WPSnacks.com
 * @link https://www.wpsnacks.com
 */
.archive .woocommerce-result-count {
	display: none;
}

That’s it, now the product result count display should be hidden from your product archive pages. Hope this helps, enjoy.

If you like this then you should look up more of our WordPress Tips Code Snippets and Tutorials.

Disclosure: There are affiliate links on posts and throughout the website and if you use the links to make a purchase we may earn a commission from it. We link to these companies and their products because of the quality of the companies and not because of the commission we may receive from it.

Disclaimer: The information contained in this website is for general information purposes only and in no event will this website or its owners be liable for any losses or damages associated with your use of our website or content. We recommend that you make a backup of your website before you make updates to it. Click here to see our full Disclaimer.

Filed Under: Code Snippets Tagged With: CSS, WooCommerce

How to remove WordPress secondary sidebar in StudioPress Genesis

May 2, 2016 by admin 1 Comment

If you are using StudioPress Genesis, you may notice that a lot of the themes have a secondary sidebar that you might not be using and you may want to remove it from the available widgets. Just add this WordPress Code Snippet to the functions.php file in your current WordPress theme in order to unregister and remove the secondary sidebar in StudioPress Genesis.
[Read more…] about How to remove WordPress secondary sidebar in StudioPress Genesis

If you like this then you should look up more of our WordPress Tips Code Snippets and Tutorials.

Disclosure: There are affiliate links on posts and throughout the website and if you use the links to make a purchase we may earn a commission from it. We link to these companies and their products because of the quality of the companies and not because of the commission we may receive from it.

Disclaimer: The information contained in this website is for general information purposes only and in no event will this website or its owners be liable for any losses or damages associated with your use of our website or content. We recommend that you make a backup of your website before you make updates to it. Click here to see our full Disclaimer.

Filed Under: Code Snippets Tagged With: Functions.php, Sidebar, StudioPress Genesis, Widgets

How to change the width of something using CSS in WordPress

April 30, 2016 by admin Leave a Comment

If you are using WordPress for your website, you may want to change the width of an element or item on your website. Just add this WordPress Code Snippet to your CSS stylesheet in your current WordPress theme in order to change the width of an item in WordPress.

/**
 * Change item width
 *
 * @author WPSnacks.com
 * @link https://www.wpsnacks.com
 */
#yourdivname {
	 width: 100px;
}

Just replace #yourdivname with whatever element, either a id(#) or class(.) that you want to change the width for and change the width to whatever size you want, either in pixels(px) or percentage(%). Hope this helps with your WordPress problem, enjoy.

If you like this then you should look up more of our WordPress Tips Code Snippets and Tutorials.

Disclosure: There are affiliate links on posts and throughout the website and if you use the links to make a purchase we may earn a commission from it. We link to these companies and their products because of the quality of the companies and not because of the commission we may receive from it.

Disclaimer: The information contained in this website is for general information purposes only and in no event will this website or its owners be liable for any losses or damages associated with your use of our website or content. We recommend that you make a backup of your website before you make updates to it. Click here to see our full Disclaimer.

Filed Under: Code Snippets Tagged With: CSS, Size

How to hide something on the Home page in WordPress

April 25, 2016 by admin Leave a Comment

If you are using WordPress for your website, you may want to hide something, some element, on the Home page. Just add this WordPress Code Snippet to your CSS stylesheet in your current WordPress theme in order to hide something from the Home page in WordPress.

/**
 * Hide something on Home page
 *
 * @author WPSnacks.com
 * @link https://www.wpsnacks.com
 */
.home #yourdivname {
	 display: none;
}

Just replace #yourdivname with whatever element, either a id(#) or class(.) that you want to hide on the Home page. Hope this helps with your WordPress problem, enjoy.

If you like this then you should look up more of our WordPress Tips Code Snippets and Tutorials.

Disclosure: There are affiliate links on posts and throughout the website and if you use the links to make a purchase we may earn a commission from it. We link to these companies and their products because of the quality of the companies and not because of the commission we may receive from it.

Disclaimer: The information contained in this website is for general information purposes only and in no event will this website or its owners be liable for any losses or damages associated with your use of our website or content. We recommend that you make a backup of your website before you make updates to it. Click here to see our full Disclaimer.

Filed Under: Code Snippets Tagged With: CSS, Home Page

How to change the height of something using CSS in WordPress

April 11, 2016 by admin Leave a Comment

If you are using WordPress for your website, you may want to change the height of an element or item on your website. Just add this WordPress Code Snippet to your CSS stylesheet in your current WordPress theme in order to change the height of an item in WordPress.

/**
 * Change item height
 *
 * @author WPSnacks.com
 * @link https://www.wpsnacks.com
 */
#yourdivname {
	 height: 100px;
}

Just replace #yourdivname with whatever element, either a id(#) or class(.) that you want to change the height for and change the height to whatever size you want, either in pixels(px) or percentage(%). Hope this helps with your WordPress problem, enjoy.

If you like this then you should look up more of our WordPress Tips Code Snippets and Tutorials.

Disclosure: There are affiliate links on posts and throughout the website and if you use the links to make a purchase we may earn a commission from it. We link to these companies and their products because of the quality of the companies and not because of the commission we may receive from it.

Disclaimer: The information contained in this website is for general information purposes only and in no event will this website or its owners be liable for any losses or damages associated with your use of our website or content. We recommend that you make a backup of your website before you make updates to it. Click here to see our full Disclaimer.

Filed Under: Code Snippets Tagged With: CSS, Size

How to add an Adsense Ad after every post in StudioPress Genesis

April 5, 2016 by admin 2 Comments

Google’s Adsense Ads are a great way to earn money from your site’s traffic. Just add this WordPress Code Snippet to the functions.php file in your current WordPress theme in order to add an Adsense Ad after every post in a site running on the StudioPress Genesis Framework.
[Read more…] about How to add an Adsense Ad after every post in StudioPress Genesis

If you like this then you should look up more of our WordPress Tips Code Snippets and Tutorials.

Disclosure: There are affiliate links on posts and throughout the website and if you use the links to make a purchase we may earn a commission from it. We link to these companies and their products because of the quality of the companies and not because of the commission we may receive from it.

Disclaimer: The information contained in this website is for general information purposes only and in no event will this website or its owners be liable for any losses or damages associated with your use of our website or content. We recommend that you make a backup of your website before you make updates to it. Click here to see our full Disclaimer.

Filed Under: Code Snippets Tagged With: Ads, Functions.php, StudioPress Genesis

How to move the WordPress breadcrumbs in StudioPress Genesis

November 6, 2015 by admin Leave a Comment

If you have breadcrumbs enabled in your StudioPress Genesis theme, you may want to move or reposition the WordPress breadcrumbs. Just add this WordPress Code Snippet to the functions.php file in your current WordPress theme in order to move the breadcrumbs to another location.
[Read more…] about How to move the WordPress breadcrumbs in StudioPress Genesis

If you like this then you should look up more of our WordPress Tips Code Snippets and Tutorials.

Disclosure: There are affiliate links on posts and throughout the website and if you use the links to make a purchase we may earn a commission from it. We link to these companies and their products because of the quality of the companies and not because of the commission we may receive from it.

Disclaimer: The information contained in this website is for general information purposes only and in no event will this website or its owners be liable for any losses or damages associated with your use of our website or content. We recommend that you make a backup of your website before you make updates to it. Click here to see our full Disclaimer.

Filed Under: Code Snippets Tagged With: Functions.php, Links, Pagination, StudioPress Genesis, Templates

How to change width of Contact Form 7 text fields in WordPress

October 29, 2015 by admin Leave a Comment

If you are using the Contact Form 7 plugin for WordPress for your contact forms, you may want to change the width of the text entry fields. Just add this WordPress Code Snippet to your CSS stylesheet in your current WordPress theme in order to change the width of the text entry fields in Contact Form 7 forms.

/**
 * Change Contact Form 7 input width
 *
 * @author WPSnacks.com
 * @link https://www.wpsnacks.com
 */
.wpcf7-form .wpcf7-form-control-wrap input.wpcf7-form-control {
	width: 250px;
}

Just change the width I listed above with whatever width you want your input text entry fields in Contact Form 7 forms to be. That’s it, now the width of your input text fields should be changed. Hope this helps, enjoy.

If you like this then you should look up more of our WordPress Tips Code Snippets and Tutorials.

Disclosure: There are affiliate links on posts and throughout the website and if you use the links to make a purchase we may earn a commission from it. We link to these companies and their products because of the quality of the companies and not because of the commission we may receive from it.

Disclaimer: The information contained in this website is for general information purposes only and in no event will this website or its owners be liable for any losses or damages associated with your use of our website or content. We recommend that you make a backup of your website before you make updates to it. Click here to see our full Disclaimer.

Filed Under: Code Snippets Tagged With: Contact Form 7, Contact Forms, CSS, Plugins

  • « Go to Previous Page
  • Go to page 1
  • Go to page 2
  • Go to page 3
  • Go to page 4
  • Go to page 5
  • Go to page 6
  • Go to page 7
  • Go to Next Page »

Primary Sidebar

Hey, We Deliver... Anywhere!

Enter Email Address below to receive our snacks via email:

Join Over 1200 Readers!

Jump To A Random WordPress Tip

Copyright © 2019 • wpsnacks.com