How to hide result count display in WooCommerce in WordPress

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 http://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.

How to change the width of something using CSS in WordPress

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 http://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.

How to hide something on the Home page in WordPress

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 http://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.

How to change the height of something using CSS in WordPress

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 http://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.

How to make hidden content pop up only when an object is hovered over with mouse

There may come a time when you need to create content that you want to have stay hidden until an object or image is hovered over with the mouse. An example of a way to use this is in making a map with map pins that when the mouse hovers over a map pin, it creates a pop up with information about that location or a project that was completed for that location. Just follow these steps to make hidden content pop up when an object or image is hovered over with the mouse on your WordPress site.
[Read more…]

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

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 http://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.

How to left align text/items in div/other element using CSS in WordPress

If you are using WordPress for your website, you may want to left align a div or other element or item on your website. Just add this WordPress Code Snippet to your CSS stylesheet in your current WordPress theme in order to left align a div or other item in WordPress.

/**
 * Left align element
 *
 * @author WPSnacks.com
 * @link http://www.wpsnacks.com
 */
#yourdivname {
	 text-align: left;
}

Just replace #yourdivname with whatever element, either a id(#) or class(.) that you want to have it’s interior elements left aligned. Hope this helps with your WordPress problem, enjoy.

How to hide remove description tab on WooCommerce Product Page

If you are using WooCommerce for an online store plugin for your WordPress site, you may want to hide or remove the description tab on the WooCommerce Product Page. Just add this WordPress Code Snippet to your CSS stylesheet in your current WordPress theme in order to hide the description tab on product pages in WooCommerce.

/**
 * Remove/Hide WooCommerce Product Page description tab
 *
 * @author WPSnacks.com
 * @link http://www.wpsnacks.com
 */
.single .woocommerce-tabs ul.tabs li.description_tab {
	 display: none;
}

Hope this helps with your WordPress problem, enjoy.

How to hide product sort by dropdown in WooCommerce in WordPress

If you are using WooCommerce for an online store on your WordPress site, you may want to hide the product dropdown sort by box shown 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 sort by drop down in WooCommerce.

/**
 * Hide WooCommerce Product Sort by dropdown
 *
 * @author WPSnacks.com
 * @link http://www.wpsnacks.com
 */
.archive .woocommerce-ordering {
	display: none;
}

That’s it, now the product sort by dropdown should be hidden from your product archive pages. Hope this helps, enjoy.

How to fix Custom Post Class not saving in StudioPress Genesis 1.8

If you use the StudioPress Genesis Framework for your WordPress site, you may also use the included Custom Post Class option inside the post pages. This option allows you to specify the post class of a specific post or page by simply typing the name of the post class in the provided field inside the post editor screen. With the latest update, StudioPress Genesis 1.8, the Custom Post Class field does not update and save when you save the page. Today’s snack will show you how to fix it so that the Custom Post Class field updates when you hit save.
[Read more…]