Noodles Newsletter Template

Developer
Lachlan Campbell
Size
3,727 Kb
Views
4,048
  1. Noodles Newsletter Template Previews
  2. Noodles Newsletter Template HTML Codes
  3. Noodles Newsletter Template CSS Codes

How do I make an noodles newsletter template?

Forked from CodePen's Pen September 2015 Newsletter.. What is a noodles newsletter template? How do you make a noodles newsletter template? This script and codes were developed by Lachlan Campbell on 11 January 2023, Wednesday.

Noodles Newsletter Template Previews
IQ Test

Noodles Newsletter Template - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Noodles Newsletter Template</title> <link rel="stylesheet" href="css/style.css">
</head>
<body> <table class="entire-page"> <tr> <td> <table class="email-body"> <tr> <td class="email-header"> <img src="https://draftin.com:443/images/48493?token=6xbaEuN42Q-h2UbjJYjlMu0Ubu3TlFzwRwagZJz2lC0-XDWwQTzpTMXzymyGjIP0woGPn0YvNmQ6oWqLyi_10yo" width="36" class="noodles-logo"> <a href="https://getnoodl.es"> Noodles News </a> </td> </tr> <tr> <td class="news-section"> <h2>Header</h2> <p>Text goes here.</p> </td> </tr> <tr> <td class="news-section"> <h2>Header</h2> <p>Text goes here.</p> </td> </tr> <tr> <td class="news-section"> <h2>Header</h2> <p>Text goes here.</p> </td> </tr> <tr> <td class="news-section"> <p>Have an awesome week!</p> <p> Lachlan <br> <a href="https://twitter.com/lachlanjc">@lachlanjc</a> </p> </td> </tr> <tr> <td class="footer"> You're receiving this email because you signed up for Noodles. You can <a href="<%= @unsub %>">instantly unsubscribe</a> any time. </td> </tr> </table> </td> </tr>
</table>
</body>
</html>

Noodles Newsletter Template - Script Codes CSS Codes

body { margin: 0;
}
td, p { font-size: 16px; color: #3c4858; font-family: "-apple-system", BlinkMacSystemFont, "Avenir Next", "Helvetica Neue", "Lucida Grande", "Lucida Sans Unicode", Verdana, sans-serif;
}
td strong, p strong { color: #1f2d3d;
}
ul { margin: 0 0 10px 25px; padding: 0;
}
li { margin: 0 0 3px 0;
}
li strong { color: #1f2d3d;
}
img { max-width: 100%;
}
blockquote { margin: 10px; font-style: italic;
}
h1, h2 { color: #3c4858;
}
h1 { font-size: 25px; line-height: 1.4;
}
h2 { font-size: 24px;
}
a { color: #ff6d00; font-weight: bold; text-decoration: none;
}
.entire-page { background: #f4f4f6; width: 100%; padding: 20px 0; font-family: "-apple-system", BlinkMacSystemFont, "Avenir Next", "Helvetica Neue", "Lucida Grande", "Lucida Sans Unicode", Verdana, sans-serif; line-height: 1.5;
}
.email-body { max-width: 768px; width: 66%; min-width: 320px; margin: 0 auto; background: white; border: 1px solid #e0e6ed; border-radius: 6px; border-collapse: collapse;
}
.email-header { border-bottom: 1px solid #e0e6ed; padding: 30px; text-align: center;
}
.email-header a { font-size: 28px;
}
.noodles-logo { width: 36px; position: relative; top: 6px; margin-right: 12px;
}
.news-section { padding: 10px 30px; border-bottom: 1px solid #e0e6ed;
}
.img-wrap { text-align: center; background: #f4f4f6; padding: 5px;
}
.img-wrap img { display: block; margin: 0 auto;
}
.img-wrap.white { background: white; padding: 20px;
}
pre { white-space: pre-wrap; background: #1f2d3d; color: #f9fafc; padding: 15px;
}
code { font-family: "SFMono-Regular", "Source Code Pro", Consolas, monospace;
}
.footer { background: #f4f4f6; color: #3c4858; padding: 10px; font-size: 10px; text-align: center;
}
Noodles Newsletter Template - Script Codes
Noodles Newsletter Template - Script Codes
Home Page Home
Developer Lachlan Campbell
Username lachlanjc
Uploaded January 11, 2023
Rating 3
Size 3,727 Kb
Views 4,048
Do you need developer help for Noodles Newsletter Template?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Lachlan Campbell (lachlanjc) Script Codes
Name
A Pen by Lachlan Campbell
Merriam-Webster Dictionary
Social Profiles
Basecamp 3 Document
Pure CSS Accordion Menu
Spinner
Action Menu
Bananner
Recipe - Banana Walnut Cake
Noodles Tags
Create amazing marketing copy with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!