Embed HubSpot Form in WordPress, Customize CSS, and Hide Fieldset Margins on Hidden Fields [code snippet]
When you embed a HubSpot form on an external site you can add css: ‘ ‘ to the embed code to remove the default form styles. If you have hidden fields the fieldset could have a margin or padding applied from your website stylesheet. This is common because you want a fieldset to have some… Read more »
Category: Code Snippets
WooCommerce Product Category and Terms Select Filters [code snippet]
The code below will help you add a form select filter for Woocommerce online shop on WordPress.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 | <?php $categories = get_terms( ['taxonomy' => 'product_cat', 'hide_empty' => true] ); ?> <div class="product-categories"> <h3>Categories</h3> <select class="form-control shop-filter" onchange="location = this.value;"> <option selected value="/shop/">All</option> <?php foreach ( $categories as $category ) { ?> <option value="<?php echo get_term_link( $category->term_id ); ?>"><?php echo $category->name; ?></option> <?php } ?> </select> </div> <?php $terms = get_terms(array('taxonomy' => 'product_tag', 'hide_empty' => true)); ?> <div class="product-tags" > <h3>Template Tags</h3> <select class="form-control shop-filter" onchange="location = this.value;"> <option selected value="/shop/">All</option> <?php foreach ( $terms as $term ) { ?> <option value="<?php echo get_term_link( $term->term_id, 'product_tag' ); ?>"><?php echo $term->name; ?></option> <?php } ?> </select> </div> <script> jQuery(document).ready(function() { var queryString = window.location.href; console.log(queryString); jQuery(".shop-filter > option").each(function() { if (this.value == queryString) { this.selected = 'selected'; } }); }); </script> |
Category: Code Snippets
How to Remove Default HubSpot CTA Styles
HubSpot allows marketers to create custom styled CTA buttons. This can be a problem if you have a large team who may not know how to follow brand guidelines. This creative freedom can make buttons look inconsistent across your website. You could educate all of your users to never create custom styles. Or you could… Read more »
Category: Code Snippets
Add Custom Info Widget to WordPress Admin Dashboard [code snippet]
The snippet below helps you customize the default WordPress admin dashboard. Sometimes the dashboard contains too much information and you want to simplify it for you or your clients. The code below will help you hide existing widgets and add a custom one. In this example I added a user guide to help new users… Read more »
Category: Code Snippets
How to Redirect WWW to non WWW WordPress [htaccess snippet]
Below are two code recipes for your htaccess file to redirect different versions of your domain. Once you have things added you can use this redirect testing tool to verify all the versions of your domain are redirecting properly.
Category: Code Snippets
HubSpot CMS Site Search Input Module Override
HubSpot provides a default module to perform a site search. By default it searches website pages and blog posts. But what if you want to override this and only search blog posts? Below is an embed snippet to help you do just that.
Category: Code Snippets
Scale Up and Crop an Image WordPress [code snippet]
In WordPress you may need to increase the size of all thumbnails but WordPress does not res up the images to prevent distortion. Using the method outlined in this example you can use object-fit to make undersized images fit your desired aspect ratio. .img-crop__polyfill image is sized to the desired dimensions. This will help keep… Read more »
Category: Code Snippets
How to Get a Wistia Video Thumbnail Without the API
Wistia video provides some handy embed codes for your videos but what if you want to create a custom player or use the thumbnail image by itself. You can use their API but the setup could me more complicated than you need. Thankfully Wistia provides Oauth url’s used in WordPress to grab the data for… Read more »
Category: Code Snippets
How Do You Change the Primary Domain in HubSpot CMS?
If you are looking to rebrand your website and change its domain there are a few steps you can take. You will most likely land on this HubSpot knowledge base article which outlines the steps but if you read it quickly you might miss a critical piece of information. At the very bottom there is… Read more »
Category: Common Questions