WooCommerce: Add Plus & Minus Buttons to Product Quantity Field

WooCommerce: Add Plus & Minus Buttons to Product Quantity Field

1. Display Plus & Minus Quantity Buttons on WooCommerce Single Product Page and Cart Page Add the following PHP snippet to WordPress using Code Snippets plugin (and choose the “Only run on site front-end” option): Source: WooCommerce: Add to Cart Quantity Plus & Minus Buttons Problem: Even though the plus & minus buttons are now…

Designing & Optimizing Preview Images for Social Media Sharing

Three examples of Bitcoin t-shirt “preview” images for when WooCommerce products are shared on social media. Yoast SEO‘s WordPress plugin makes these images easy to attach to each product. Model t-shirt mockups (with transparent background) generated with Printful‘s Design Maker. Layout using Affinity Designer. Final designs exported from Affinity Designer to JPEG format with Quality…

Redesigning 15 Year Old Website – Inspired Amateur Productions

Music recording studio website gets a face-lift! This included new discography features that linked artists with their albums, and linked recording engineers and producers with the albums they worked on. Old Website Old specs for 2008 New Website New specs for 2022 Check out the new site: Tom Gordon’s Inspired Amateur Productions & Imirage Sound…

Switch Image Background Color On WooCommerce Variation Image Gallery

Goal: Display an enlarged version of t-shirt artwork on 9 different garment color options. Approach: Instead of generating and uploading 9 different artwork files with 9 different color backgrounds, we’re doing the following: This keeps everything lightweight. Switch Image Background (using CSS) On Color Variation Selection – Business Bloomer

WooCommerce – Add Extra Gallery Image Upload Field For Product Variations in WooCommerce Product Edit Page

Goal #1: Locate PHP & Javascript files in WooCommerce v7.3.0 plugin that involve uploading WooCommerce Single Product Variation Gallery Images, so I know where everything is and what it looks like in default mode. Goal #2: Add new PHP & Javascript that will add an extra gallery image upload field for WooCommerce Single Product Variations….

FlexSlider “Navigation Arrows” WooCommerce Product Gallery Image Slider

Navigation Arrows Add Navigation Arrows in FlexSlider (v2.7.2) WooCommerce Product Gallery. Requires linking to “Font Awesome 5 Free” CSS file for the Navigation Arrows. Follow How to Use font awesome icons as CSS content code (mainly, Step 1: Load the font awesome CSS file; ignore the brand icons aspect). Place the below PHP code in…

FlexSlider “Dot Pagination” WooCommerce Product Gallery Image Slider

Dot Pagination Use Dots on Mobile and Thumbs on Desktop Add Dot Pagination to FlexSlider (v2.7.2) WooCommerce Product Gallery Image Slider. By default the product gallery navigation uses thumbnails, but this can be swapped to dots by changing the ‘controlNav’ value to true. Place the below PHP code in Code Snippets, and set to Only…