design-code.tips

Struggling with missing thumbnails for grouped products in WooCommerce? In this episode, we share a simple fix using a code snippet in your child theme’s functions.php file. Plus, a bonus tip on displaying all variations of variable products—along with a cautionary note! Tune in for quick WooCommerce dev insights. -- Read the full blog post: How to Add Thumbnails to WooCommerce's Grouped Produ...

Want better SEO and cleaner URLs? In this episode of the Design Code Tips podcast, we break down URL slugs—those key words at the end of a web address that improve discoverability. Based on insights from Nuno Marques, we’ll explore why concise, descriptive slugs matter and how to craft them for better search rankings and user experience. -- Read the full blog post: Slugify Online: Clean URL Slug G...

Want to improve your WordPress site’s loading speed? In this episode, we explore how deferring JavaScript execution can enhance performance. We break down a PHP function that adds the defer attribute to <script> tags, allowing essential content to load first while delaying non-critical scripts. Plus, we discuss handling jQuery exclusions to avoid conflicts and why this simple tweak can make...

In this episode of the Design Code Tips podcast, we take a nostalgic dive into the 2001 2Advanced Studios Showreel, a masterpiece from the early days of web design and animation. Discover how this iconic work set benchmarks in creativity, animation, and storytelling, inspiring designers for over two decades. Whether you’re crafting your own showreel or looking for timeless inspiration, this episod...

In this episode, we explore the power of TinyPNG, a tool that compresses JPEG, PNG, and WebP images with impressive size reductions of up to 80%—all without compromising quality. Discover how image optimization improves website loading times, enhances user experience, boosts SEO, and reduces bandwidth costs, making it an essential practice for better online performance and visibility. Tune in to l...

In this episode, we dive into a practical WordPress tutorial on adding custom HTML content to a single page. Learn how to create a popup message using the wp_footer action hook and conditional logic based on a page ID. We’ll walk you through the full code example, including optional JavaScript for interactivity, and showcase a real-world scenario with age verification on page ID 2647. Tune in to d...

In this episode, we dive into customizing WooCommerce's local pickup shipping method using PHP and JavaScript. Learn how to add custom fields for pickup location and time, save these preferences as order metadata, and display them in order details and emails. We also explore how to hide the delivery section for local pickup customers, simplifying the checkout experience. Plus, discover how to...

In this episode, we break down the essentials of Semantic HTML and why it’s a cornerstone of modern web development. Discover its benefits for accessibility, SEO, code maintainability, and cross-browser compatibility. Learn how to use semantic tags like , , and to structure your content effectively, and explore best practices for creating intuitive, user-friendly web experiences. Tune in and eleva...

In this episode of the design-code.tips podcast, we explore how to customize the WordPress admin panel using CSS. Learn how to create a custom admin.css file, add it to your theme, and apply role-based styling for tailored admin experiences. We’ll share code examples, including a use case for online shops, demonstrating how to hide or style elements and even generate printable PDFs of the WooComme...

In this episode of the Design Code Tips podcast, we explore the evolution of responsive web design—from fixed layouts to today’s mobile-first approach. Discover the core principles like fluid grids, flexible images, and media queries, and learn why they’re essential for user experience, SEO, and efficient development. We’ll also dive into challenges like performance optimization and innovations li...

Welcome to design-code.tips — a bite-size podcast where modern web development, thoughtful UI design, and smart AI workflows meet. In each short episode we distill a blog post into clear takeaways you can apply today: faster React patterns, Tailwind tricks, accessibility wins, and time-saving tools. Created by Nuno Marques (a.k.a. ositaka). (Episodes scripted with the help of Notebook LM.) -- Go t...