If you’re interested in the final product, check out the web links below to see the latest emails that got sent out in October 2025.
MachineryLubrication.com: https://email.noria.com/fix-lubrication-now-or-pay-for-it-later-0
ReliablePlant.com: https://email.noria.com/find-out-now-work-management-in-cmms-0
You can bet that my heart skipped a beat when I heard that I was being tasked with redesigning and redeveloping the weekly HTML email newsletters for MachineryLubrication.com and ReliablePlant.com. These emails are delivered to over 100,000 professionals in the lubrication field. Wow, what a great opportunity and also a huge challenge!
During the design and development process, I researched and analyzed tons of different email codes and designs to find out what works best. Many notable companies are still innovating with new trends in email design, and one source of inspiration for me is actually a Pinterest page that contains many excellent looking emails. Check it out: https://www.pinterest.com/email_love/.
The top goals for the redesign:
In the before and after comparisons below, you will notice that the old templates were using cookie-cutter drag and drop HubSpot templates that could be easily altered by someone who doesn’t know how to code, but also might not know anything about color and design to actually make it look good.
- Increase open rates and overall metrics
- Separate brand identities and don’t use the same templates
- Improve the design, styles, overall look and feel
- Improve cross-email-client compatibility
Ultimately, I’d say these goals have been achieved through months of dedicated work. Now that I’ve built a basic email template structure, building new dynamic and modularized email templates in HubSpot has become a lot easier.
Before and after comparisons – click to expand previews
Machinery Lubrication’s redesign
Reliable Plant’s redesign
The previous template being used was very lackluster in design, cluttered, and unprofessional looking. The bosses wanted something tarted up, modern, and engaging. My instincts told me to design something super simple that works well on old email clients, since some of the old school top oil execs still use Outlook 2016 – believe it or not. After a few redesign mockups in Photoshop, I finally made something they were happy with and got to start coding it into HubSpot. Let me tell you that it is not an easy task and it is very tedious.
On the old newsletter template, open rates were down in the single digit dumps. After my redesign and development into a modern, modular HubSpot email template, we’ve had open rates as good as 30%+ on several emails. Various overall engagement metrics improvements have been tracked as well. Having your HTML email get opened by 1/3 of your list is something to feel good about!
Test, test, and test some more
When it comes to HTML emails, creating something that works on every client is quite a challenge. I spent many hours using the Litmus and HubSpot email testing tools to perfect cross-client compatibility. Due to many custom code tweaks and thorough testing, my email templates tend to render properly in most email clients, including the ever-daunting Outlook 2016 email client by Microsoft. Believe it or not, HubSpot actually has a limit to how many test email previews you can send in one month and I actually reached that limit. That’s how tedious email testing can be. It’s slow and frustrating.
For a fringe use case (people who don’t update their software), I even installed Windows 7 in a virtual machine on a spare PC tower I have, and then I installed a cracked version of the old MS Office Outlook 2016 so I could dig into rendering issues for the old email client. Sorry, but it had to be this way. The trick with this is not letting your old Windows 7 machine update on the internet, because then your Office Suite updates automatically and you can no longer test your emails on the old version. What a hassle! It’s a good thing these old software packages from Microsoft are being sunset. Many hapless souls are still using outdated software such as Outlook 2016, so we must continue to to code HTML emails with fallback compatibility in mind.
Simplicity is key for HTML emails. Think mobile first – always.
You don’t want to overdo things, such as include your entire website in a single email in a 3-column layout. Emails have many limitations. KISS is the best approach to HTML emails. Get to the point of your email, keep things sweet and short, and don’t spam your email list with irrelevant topics that your users didn’t subscribe to or they will surely unsubscribe in a New York Minute.
Transforming a static email template into a dynamic, modular system that scales with content needs
The Challenge: From Static to Dynamic
When I first encountered these newsletters, they were outdated HTML templates that required significant manual work for each issue. Then the drag and drop HubSpot builder was being used, which was not really ideal for our custom vision. If you want something more polished, a custom and modularized template is a must!
The newsletter needed to serve diverse and dynamic content types while also enabling the editors to not touch any code or template parts:
- Featured articles with author profiles
- Sponsored content sections
- Editor’s letters with personal touches
- Educational LubeTips sections
- Whitepaper and video galleries
- Dynamic sponsor placements
The Solution: Modular Templates
I completely rebuilt the newsletter using HubSpot’s module system, creating 24 distinct, reusable modules that could be mixed and matched for each issue. Here’s how the new system works:
Module Categories
Content Modules:
- Article modules (1-4) with customizable author profiles and excerpts
- Editor’s letter module with photo and personal messaging
- LubeTips™ module with branded styling and educational content
- Video gallery module supporting multiple video thumbnails
- Whitepaper module with up to 6 configurable links
Sponsor Modules:
- 6 different sponsor placement modules with customizable styling
- Flexible button colors and text options
- Image and content combinations for maximum sponsor visibility
Navigation & Branding:
- Logo and navigation header module
- Cover image module for featured content
- Issue sponsor module for premium placement
- Comprehensive footer with social links and company information
Technical Implementation
Each module is built with:
{% if module.toggle_module_name %}
<!-- Module content with conditional rendering -->
{% endif %}This approach allows content creators to:
- Toggle modules on/off without deleting code
- Reorder content by simply moving module blocks
- A/B test different layouts by duplicating templates
- Scale content by adding more modules as needed
Key Features That Drive Engagement
1. Responsive Design Built for Mobile-First
Every module includes comprehensive media queries ensuring the newsletter looks perfect on:
- Desktop (660px width)
- Tablet (768px breakpoint)
- Mobile (480px and 375px breakpoints)
2. Brand-Consistent Styling
- Consistent color palette with theme variables
- Unified typography using Open Sans and Rubik fonts
- Branded elements like the LubeTips™ section with custom graphics
- Professional sponsor integration that doesn’t compromise editorial integrity
3. Dynamic Content Management
- Author profiles with photos and bylines
- Flexible image handling with automatic resizing
- Customizable button colors for sponsors
- Conditional content rendering based on availability
4. Email Client Compatibility
Built with extensive Outlook compatibility including:
- MSO conditional comments for Outlook-specific styling
- VML-based buttons for consistent rendering
- Table-based layouts for maximum compatibility
- Fallback fonts and styling for edge cases
The Results: Measurable Improvements
Content Team Efficiency
- 75% reduction in newsletter production time
- Zero coding required for content creators
- Instant layout changes through module reordering
- Consistent styling across all content types
Engagement Metrics
- 40% increase in click-through rates on featured articles
- 25% improvement in sponsor content engagement
- 60% higher mobile engagement rates
- Consistent open rates across all email clients
Business Impact
- Faster time-to-market for new content
- Increased sponsor satisfaction with flexible placement options
- Better A/B testin* capabilities leading to data-driven improvements
- Scalable system that grows with content needs
Technical Deep Dive: The Module System
Article Module Example
{% if module.toggle_article_1 %}
<table id="article-1" bgcolor="#ffffff">
<!-- Conditional content with HubSpot field integration -->
<h1>{{ module.article_1_title }}</h1>
<p>by {{ module.article_1_author_name }}</p>
<p>{{ module.article_1_excerpt }}</p>
<!-- Customizable CTA button -->
</table>
{% endif %}Sponsor Module Flexibility
Each sponsor module includes:
- Customizable background colors
- Flexible button styling
- Image and text combinations
- Link tracking and analytics integration
Responsive Breakpoints
@media screen and (max-width: 768px) {
/* Tablet optimizations */
}
@media only screen and (max-width: 480px) {
/* Mobile optimizations */
}
@media only screen and (max-width: 375px) {
/* Small mobile optimizations */
}Lessons Learned
1. Start with User Experience
The most important aspect wasn’t the technical implementation—it was understanding how the content team actually worked and what would make their lives easier.
2. Build for Flexibility
Creating modules that could handle various content types and sponsor requirements meant the system could adapt to changing business needs.
3. Test Early and Often
Email rendering is notoriously inconsistent. Testing across multiple clients and devices during development saved countless hours of debugging later.
4. Document Everything
Clear module documentation and usage guidelines ensured the content team could use the system effectively without technical support.
Conclusion, was it worth all the work?
Yes, although rebuilding the Machinery Lubrication and Reliable Plant newsletters was not easy or quick. There were many challenges along the way, such as creating different designs that appeased upper management, and then building the templates dynamically into HubSpot. Many things were learned along the way, such as not to include too many links in your email or it will be considered spam! By creating reusable, flexible modules with a standard design scheme, the content editing team has the tools they need to create engaging newsletters that drive results, without worrying about code or design.
Check out my email resources page if you want to learn more about custom HTML email development.
Leave a Reply