Everything Typepad

Quickly Create Your Store With Ecwid

We've integrated Ecwid! A popular e-commerce platform, Ecwid offers multiple plans for all sizes of businesses. You can get started with any plan (even free!) to launch your shop and, what's more, we've made it super simple to integrate it into your Typepad blog. Join our Beta team to get early access to Ecwid.

Now, let's go through the process together.

To get started, you'll need to create an Ecwid account, which you can begin by browsing to Blog > Settings > Ecwid. Click on Create your own store at Ecwid to be redirected and start the process.

The Ecwid login page will show in a new browser tab. Select Create new Ecwid account to start your new account. First, you'll be asked to enter your name, email address, and password. Your email address will be used as your username.  Now, there are 4 steps to finish setting up your Ecwid account. 

Step 1: Give your store a name, select your country, and currency. 

Step 2: Enter your business' physical address. If you don't have a company address yet, please enter an address from where you'll be shipping your orders. 

Step 3: Tell Ecwid about yourself. They want to know about your experience selling products, what type of product you're selling, and if you're selling for someone else. 

Step 4: Tell Ecwid about your website. They want to know if you have a website and with which service. Currently, Typepad is not listed. You can select Other, then enter Typepad into the box. 

Congratulations! You've created your Ecwid account. Now you'll need to add your products into Ecwid. 

In Ecwid, you will see a To-Do list. Part of the To-Do list is adding your product to your account. Click on Add your products or services and follow their instructions. Once you are done adding your products you're ready to add your store to your blog.

Click on the Dashboard link of your Ecwid account. At the bottom of the page you'll find your Store ID. Copy this number to be used in Typepad. 

In your Typepad account, go back to the Ecwid section (Blog > Settings > Ecwid). Under Already an Ecwid user? paste in your Store Id and click on Save Changes. 

Next, click on Create Store Page in my Blog. Typepad will create a page for you titled Store. You can add text to tell people more about what you're selling.

NOTE: You won't see the products you added on the Compose Page or Preview, only when you publish the page. 

Share your store on your blog by adding it to your navigation bar or sidebar with a fun image. 

Now that you've created and integrated your store, share the link with us in the comments! We'd love to see (and maybe purchase) what you're selling!

Get Started With Amazon Associates

Now that you have been blogging for a while, you may be wondering "what's the next step?" You work hard to create amazing content, joining Amazon's Associate program is a great way to monetize that content. You can easily start an account and generate code to add to your blog.

Amazon's Associates program is a referral program. When a reader clicks on an Amazon link from your blog, you get a percentage of what they purchase in the next 24 hours. Let’s go over creating your Amazon Associates account. 

Join Amazon Associates Program

From the Amazon Associates homepage you can click on Join Now for Free to either log into your existing Amazon account or create a new account. 

Set-up Your Amazon Associates Account

Amazon will ask for your personal information. Add your name, mailing address and phone number. If you already have an account, you will see your information there. 

Add Your Blog URL

Amazon needs to know where you are on the web. Add the URL to your blog along with any social media sites (they only accept Facebook, Instagram, Twitter, YouTube, and Twitch.tv). If you have a mapped domain, add your mapped domain and your Typepad URL. Once you click on next, you will need to confirm your blog is not directed to anyone 13 years or younger. This is to be compliant with Children's Online Privacy Protection Rule ("COPPA").

Set-up Profile

Here you can tell Amazon about your blog. What is your blog about? How do you drive traffic to your blog? How many unique views do you receive each month? Most of these questions are answered with multiple choice answers or picking from a drop down menu. You will need to accept their terms of service and then click Finished. 

Payment and Tax information

Tell Amazon how you would like to be paid. You can get a direct deposit after you have earned $10, an Amazon gift card after you earned $10, or have a check mailed to you after you earned $100. If you are unsure how you want to get paid or need to gather information you can skip this part. 

Next, you can add your tax information. You can set it up as an individual or as a business. If you select individual, you will need to add your full name and SSN/ITIN number. If you select business, you will need to select a Federal Tax Classification and add your EIN. 

Congratulations! You've created your Amazon Associates account. At first you are under their Application Review Process. You have 180 days to generate at least 3 sales to continue with your account. Amazon offers several ways to generate sales. Something we will go over in our next post!

 

Quick Tip: Change The Color Of Your Navigation Links In Magazine

Our new Magazine Layout showcases your blog posts using a featured card layout. You can further customize this theme by changing the color of the navigation bar links to match your branding. Let us show you how. 

The Magazine layout is available to our Beta Team members. Join our Beta Team and have access to all the new features and provide feedback. To access the Custom CSS you need to have the Unlimited plan or higher.  

To add Custom CSS, click on the Blogs tab, then the name of the blog. Click on the Design tab, then Custom CSS.

Copy the CSS code below and paste it onto the page. 

.nav-item a, .nav-item a:visited {
   color: #DD77D2;
}

Next, update the color: to include the hex color value you want for your navigation links. Once you are done, click on Save Changes. 

Example of colors:

Black
.nav-item a, .nav-item a:visited {
   color: #000000;
}

Blue
.nav-item a, .nav-item a:visited {
   color: #002fa7;
}

Red
.nav-item a, .nav-item a:visited {
   color: #ff4105;
}

You can customize other parts of the Magazine. We have a great post to help you customize your blog title.

What other parts of the Magazine Layout do you want to customize? Let us know in the comments and you may see a post about it!

Typepad 101: Buy Your Own Domain Name

One of the first things you may have noticed when you created your account was the URL created for your blog looks something like example.typepad.com.  Many bloggers are ok with their blog link looking this way, but if you want to customize your blog name and make it easier to remember for your readers, you can do that by buying your own domain name through Typepad.  Setting up a custom domain name for your blog is done through a process called Domain Mapping. Domain Mapping is available with Pro Plus accounts and higher.

Choosing a Domain Name

To get started, go to Account > Domain Mapping, at the top of the page you can do a search on the domain name you are interested in buying (ie: www.ilovestamping.com).

After clicking the "Check Availability" button, you will be redirected to a new screen showing the name availability in addition to other names you can purchase with different extensions. 

After you select your name it will appear in your Shopping Cart. Your cart will also include the option purchase additional privacy protection which is recommended if you wish to keep your personal information attached to your domain name private.  When you are ready to purchase, click the green "Checkout" button.  

Create Your New Account

You will be taken to a new page with your cart overview and a prompt to create or login to your account.  If this is your first time purchasing a domain name through Typepad, you will need to create a new account.  This is not the same as your Typepad account and it can have different login credentials. 

Once your account is created, you will proceed with your purchase by choosing the Typepad Billing option and select to Pay Online.  This will set it up so you are charged with the credit card or PayPal account you have saved in your Typepad account. You will be directed back to Typepad where you click Approve to complete purchase of the domain. With successful payment, click Complete Registration.

Set Up Domain Mapping

In your Typepad account, go back to Account > Domain Mapping.  Your new domain should appear under "Domain Map with Typepad." Confirm that it's status is "Verified" - if it's not, that means the domain name registry waiting for you to pay your invoice or confirm your email address.  If it's marked as verified, click the button "Map a Domain Name" to set up Domain Mapping for your blog.

You will be asked to enter a subdomain for your blog.  The most common subdomains used are "www" or "blog" for "blog.domainexample.com".  Then select if you want to map your domain name to your entire site or just a specific blog in your account. 

The next step is to check the box to "Forward the non-www domain to this subdomain?" This will allow visitors to access your blog with or without typing the "www" for your URL.

Activate Your Domain Name

Scroll to the bottom of the page to "Mapped Domains."  Your new name should be listed but not activated.  Click the "Activate" link to make your Domain Mapping live.  The SSL status will first appear as "initializing" but if you refresh browser a couple of times it will change to "pending validation" to "active."  This means your blog is now loading securely with it's own SSL certificate.

 

Typepad 101: Design Your Blog

Now that your blog is up and running and you are publishing content, let's make sure your blog is looking the way you would like it to look. The look of your blog is really important - it is the very first impression a visitor gets when checking out your blog for the first time. Today's Typepad 101 is about what's available to create a design for your blog.

When you create a blog, it defaults to the "Journal Black" theme. You can stay with this theme if you'd like as it's offered in five different colors.  Or you can switch to another pre-designed theme. 

Choose Your Theme

To see what themes are available to apply to your blog, go to the "Design" tab.  This page is broken up into three sections:

Current Design: This section shows your current design with options on how to customize your current design (Banner, Style (for Design Lab themes), Layout, Content). 

• Banner: upload your new banner
• Style: customize the overall appearance of your blog (fonts, colors, borders)
• Layout: select 1, 2, or 3 column layout
• Content: Add and edit what is shown in your sidebars, post & blog footers, etc.

Create a New Design: This includes a green button "Choose a Theme."  This will take you to a new page with a gallery of thumbnails showing pre-made designs you can apply to your blog.

You can view your options by Feature, New, Customizable, and All.  

Your Designs: Every time you add a new design to your blog, it saves in your Typepad account so you can always go back and reuse it instead of starting over.

About Customizable Options

The Customizable option includes Design Lab, Theme Builder, Styleless, or HTML aka Advanced Templates.   The Styleless or Advanced Templates options are recommended only if you are comfortable working with HTML and CSS code and building your custom design from scratch.  These two options are available for Unlimited plans and higher.

Design Lab and Theme Builder are easy to use with no code required to customize the look of your blog. You can select the colors, fonts, and upload your banner.  You can add additional CSS code to customize your design further but not required. Design Lab is responsive and looks great on all devices, large and small, and meets Google's mobile-friendly requirements.  Theme Builder also has an option to create a responsive design

If you ever get stuck or have questions about how to make something work with your blog design, you can always open a Help Ticket and a member of the team will be happy to help!

 

Typepad 101: Let's Get Started - Manage My Blog

Welcome to Typepad! Or if you previously had a Typepad account and are starting up your blog again - welcome back!  When you begin your free 14-day trial, the first place you go to is your Dashboard.  This is where you can quickly access your blogs, account settings, profile settings, files, open a Help Ticket, view updates from other Typepad accounts you follow, and even purchase your own custom domain name if you continue with a paid Pro account.

Manage My Blog

Located on the top, right sidebar of your Dashboard, you can access specific settings to your new blog starting from here.  As you add more blogs to your account, you will find more blog names listed in this box as well as the "Blogs" link in the top menu bar. From the "Blogs" menu, you can select the name of the blog to manage the settings of that blog.

View Blog: You can see what your blog looks like clicking "View Blog" under the thumbnail image.  Right now, there is not much there, it is just a skeleton of what your blog could look like but you can design it to your liking.

Compose: If you want to get started blogging right away, you can access the Compose page by clicking the "Compose" link under "Manage My Blog".  You will also see a yellow "Compose" button on every page within your blog settings.

Stats: This is your Overview tab. It displays analytics and referrals to your blog. The more you publish and share your blog post links elsewhere, the more data will appear on this page.

Posts: As you publish more posts, this list will grow.  It displays all of your blog posts - published, and saved as drafts in chronological order.   You can change the status of blog posts from Published to Draft or vice versa, or delete posts.  You can select more than one posts to change their status by checking the box on the left of each title, then scroll to the bottom to publish, draft, or delete.  You can also assign posts to categories, open and close comments from the drop-down menu on the bottom right.

Comments: If you use Typepad for your comments, you can view all comments left on your blog on this tab.  You can reply, edit and view comments directly from this page. You can also publish, unpublish, delete, and mark comments as spam.

Design: Typepad has many pre-made designs you can easily apply to your blog or you can customize your own design using Design Lab or Theme Builder.  In "Create a New Design" click the green "Choose a theme..." button and select a theme from our gallery. 

Settings: This is where you create the backend settings to your blog including your blog name and description, welcome message (optional), whether you want to create password protection, search engine optimization, category creation, comment configuration,  post-by-email, and more.

A word about Getting Started Tasks

There is a drop-down menu on the right of your Dashboard titled Getting Started Tasks.  These can be completed at your own time while you are blogging. The Getting Started Tasks on the Dashboard are only suggestions, and you do not need to complete all tasks in order to utilize all the features of Typepad.

Stay tuned for more Typepad 101 blog posts on how to get started with your blog and publishing your posts!

Blog Smarter with Master Templates

Everyone has heard the saying "Work smarter, not harder." At Typepad, we are here to give you tips and tricks to make sure your blog is a success! Today we are going over how to create a Master Template for sharing recipes.  

First, you want to copy the code below and put it into a new blog post by clicking on the HTML tab on the Compose page. 

Code For Recipe Template

<h1>Title Of Recipe</h1> <table style="height: 17px; width: 60.0386%; border-collapse: collapse;"> <tbody> <tr style="height: 17px;"> <td style="width: 41.2403%; text-align: left; height: 17px;"><a href="#Recipe"><strong>Jump To Recipe</strong></a></td> <td style="width: 50.7749%; text-align: left; height: 17px;"><strong>Print Recipe</strong></td> </tr> </tbody> </table> <p> </p> <p><a class="asset-img-link" href="https://annad.typepad.com/.a/6a01b7c892952a970b0240a46f157d200d-pi" style="display: inline;"><img alt="Banner Recipe Image" border="0" class="asset asset-image at-xid-6a01b7c892952a970b0240a46f157d200d image-full img-responsive" src="https://annad.typepad.com/.a/6a01b7c892952a970b0240a46f157d200d-800wi" title="Banner Recipe Image" /></a></p> <p>Write about what makes the recipes great. Share reactions from friends and family who loved this dish. Add some pro tips that would make the preparing the dish easier. If the recipe has a sentimental story (the first dish you prepared with your grandma) share it with your readers here! </<<gwmw class="ginger-module-highlighter-mistake-anim ginger-module-highlighter-mistake-type-1" id="gwmw-15530985049279069352623">gwmw</gwmw> class="ginger-module-highlighter-mistake-<gwmw class="ginger-module-highlighter-mistake-anim ginger-module-highlighter-mistake-type-1" id="gwmw-15530985049278121691290">anim</gwmw> ginger-module-highlighter-mistake-type-1" id="<gwmw class="ginger-module-highlighter-mistake-anim ginger-module-highlighter-mistake-type-1" id="gwmw-15530985049274564880519">gwmw</gwmw>-15530984370462066335342">p</<gwmw class="ginger-module-highlighter-mistake-anim ginger-module-highlighter-mistake-type-1" id="gwmw-15530985049270327553392">gwmw</gwmw>>> <p>Does your recipe require any special equipment? This would be a great time to talk about how to use that equipment or where to purchase the equipment. Add links to any affiliate programs you participate in. Does the recipe call for any advanced baking techniques. Describes these techniques in more details here.</p> <table style="width: 100%; border-collapse: collapse; background-color: #d1cbcb;" border="0"> <tbody> <tr> <td style="width: 100%;"> <p style="text-align: center;"><span style="font-size: 18pt;"><a id="Recipe"></a>Recipe Title</span></p> <p>Ingredients</p> <ul> <li>Recommend grouping dry goods and wet goods.</li> <li>Don't forget to add the measurements.</li> <li>Use simple generic names, not name brands.</li> </ul> </td> </tr> <tr> <td style="width: 100%;"> <p>Directions</p> <ol> <li>Short bite-size steps are the best.</li> <li>Have someone read over them to make sure they are easy to follow.</li> <li>Use common language when describing preparation.</li> <li>Don't forget to include cooking time and temperatures.</li> </ol> </td> </tr> </tbody> </table> <p> </p> <div id="featherlight-gallery" data-featherlight-filter="a" data-featherlight-gallery="" data-featherlight-type="image"><fieldset class="asset featherlight-gallery border" gallery-width="150-auto"><legend class="featherlight-gallery border">Use the Image Galler to display more images!</legend> <div class="featherlight-gallery">Use the Image Gallery to share preparation images and family enjoying the dish! Try to keep the images around the same size so they display consistently in the scroll bar or grid. </div> <div id="gallery-container" class="gallery-scroll"> <ul class="asset-thumbnails"> <li class="asset-thumbnail" id="li0" draggable="true"><a href="https://annad.typepad.com/.a/6a01b7c892952a970b0240a46f17ae200d-pi"><img alt="Food One" class="mceNonEditable" src="https://annad.typepad.com/.a/6a01b7c892952a970b0240a46f17ae200d-150si" /></a></li> <li class="asset-thumbnail" id="li1" draggable="true"><a href="https://annad.typepad.com/.a/6a01b7c892952a970b0240a46f17b2200d-pi"><img alt="Food Two" class="mceNonEditable" src="https://annad.typepad.com/.a/6a01b7c892952a970b0240a46f17b2200d-150si" /></a></li> <li class="asset-thumbnail" id="li2" draggable="true"><a href="https://annad.typepad.com/.a/6a01b7c892952a970b0240a46f17b6200d-pi"><img alt="Food Four" class="mceNonEditable" src="https://annad.typepad.com/.a/6a01b7c892952a970b0240a46f17b6200d-150si" /></a></li> <li class="asset-thumbnail" id="li3" draggable="true"><a href="https://annad.typepad.com/.a/6a01b7c892952a970b0240a46f17ba200d-pi"><img alt="Food Three" class="mceNonEditable" src="https://annad.typepad.com/.a/6a01b7c892952a970b0240a46f17ba200d-150si" /></a></li> </ul> </div> </fieldset></div>

Now click on the Rich Text tab to see the post and make changes. 

TIP: Name this post Master Recipe and save it as a draft. Make any changes to the font, color, and branding you want to have in every post.  Change the status to Draft and click Save. Now you have code to reference for future blog posts. 

Table For The Recipe

The recipe is in a 1x2 table. This gives you a section for the ingredients and a section for the instructions. You can change the background of the table to match your brand colors. 

To edit the background color, click in the table then click on the Table Properties icon in the bar under the table. On the Advanced tab, click on the little square to select a color. Put in the hex value or RGB values of the color you want. Click Ok. You will see that color in the little box and the hex value next to it. Click OK to save your changes. 

You can do the same thing to add a border around the table. Keep in mind this will add a border around each cell. 

Add Code To New Post

Now that you have the Master Template post set up, you want to save it as a draft. Next to Status click on the drop down and select Draft, then Save. 

When you are ready to create a new recipe post, search for the Master Recipe post and click on the title to go to the Compose page. From the Compose page, click on the <> button to view the source code, copy the source code. Next, click on the Posts tab, and create a new post. Click on the <> button and paste in your code. Select Ok. 

Adding A Printed Version

Some home chefs don't like to have their phones out while they are preparing food. Always offer a way for your readers to print out your recipes. We recommend that you write them up in a document and save as a PDF. PDF's are easy to upload, download, and print on a multitude of devices. Look for 'Print Recipe' in the recipe template, then click on the File icon. Choose the PDF file of your recipe, then click OK to upload and link it to the highlighted text. The 'Print Recipe' text will change to 'Download NAME OF FILE'" where "NAME OF FILE" is italicized but not capitalized like in my example here. You can keep the default text or customize the text by clicking the newly made link and editing the text in the 'Change the Text to Display' field. Click OK to save the change. TIP: The Jump To Recipe link is an anchor link that is already set up to go down to the recipe. No need to change anything. 

Image Gallery

The Image Gallery is a great way to display your images. You can add images of you creating the dish or of your family and friends enjoying the meal. 

To change the images in the image gallery, select one image, then click on the Insert Image icon. Choose file and select all the images you want to add.

Tip: Hold down CTRL to select multiple images if you are using Windows. If you are using a Mac, hold down CMD. 

Select Insert Images to add the images to the scroll bar. Once you have added your images, you can delete our images. Select the Image and tap delete on your keyboard.

To change the text, click on the text and delete what is written. Now type in what you want to add.

We recommend using a master template to save time with formatting and managing images. We provided one example of how such a template could be used, but we'd love to learn what other types of templates you would like to see. Make sure to leave a comment with your thoughts and suggestions!

Switching To a Mobile Design - Let Us Help With Typepad Design Services!

For some of our long-time Typepad bloggers, the thought of redoing your entire blog design can be stressful. Where do you even start?  Usually when this request comes in, we first recommend creating a test blog so you can play around with our different responsive themes first before applying it to your main blog.

But what if you don't have the time to do all of that? Let Typepad Design Services help!  Typepad Design Services includes Tune-Up service and Custom Design service for an additional fee. We will work with you to create an amazing blog that is everything you could wish for.

When we receive a request to update a blog design, we always refer to the Nimble Design Lab to get started and build your design around this theme. Here are a few of the Design Services we loved!

Here is a great example of using a Landing Page with your mobile design.

When was the last time you updated your blog design? Are you using a Responsive theme for your blog? 

Add A Scroll Bar To Large Tables

Sometimes you need to provide a lot of information in a table format. Large tables can be hard to read when they are shrunk down on mobile devices. You can quickly add a piece of code to your table to give it a horizontal scroll bar. When mobile readers view your blog, they can scroll through the table. 

First you will need to add your table. Click on the Table drop down and select Table. Highlight how many cells you will need. 

After you have inserted your table you can customize it by adding your content and changing the properties. 

Once your table is complete, click on the HTML tab on the top right of the compose page. Find the table in the HTML. The table starts with <table> and ends with </table>.  A great way to help block out this code is to put a space before and after the table code.  

Here is how it looks before you enter the code:

Above your <table> tag, add the following code: 

<div style="overflow-x:auto;">

After <\table> add the following code:

</div>

Here is how it looks after you add the code

Save/Publish your changes, then click on the Rich Text tab to see your table. You may not see the horizontal scroll bar on the compose page, so preview or publish your post to see the scroll bar.

Check out the horizontal scroll bar in action. We have added it to the table below. You may need to reduce the size of your browser window or view this post on a mobile device to see the scroll bar at the bottom of the table.

	Grade	Grade	Grade	Grade	Grade	Grade	Grade	Grade	Grade	Grade
Eric	75%	80%	100%	94%	87%	100%	79%	86%	92%	86%
June	95%	78%	100%	86%	73%	96%	97%	92%	86%	94%

When creating any post you need to make sure you keep your mobile readers in mind. When the table is viewed on a mobile device your readers will be able to horizontally scroll through all your columns and easily read your table. Make sure you are using one of our mobile themes so your blogs looks flawless on mobile devices. 

Go to your account now to get started!

How To Add A Pinterest Button To All Your Images!

Pinterest is a great place to get your blog seen! Who doesn’t love spending free time searching Pinterest for their dream DIY? Make it easy for your readers to add your amazing images and posts to their Pinterest boards by adding a Pinterest Save button.

First,  go to the Pinterest Widget Builder and click on the Save Button. From the Button Type drop down, select Image Hover. Select if you want a round image or a large image.

After you are done designing your button you will be given code to add to your blog.

From your Typepad account, click on the Blog tab > name of your blog > Design > Content. Add an Embed Your Own HTML module and Paste in the code. Give the module a name and click on OK. Last, click on Save Changes. Don't worry, the Label will not show on your blog. 

Now your readers can share your amazing images on their Pinterest boards. Just hover your cursor over the image to see the Save button.

Log into your Typepad account today to get started.