Stop Publishing Boring Articles! Use Thrive Architect to Spice Them Up

Author
Hanne   139

1 hour 23 minutes.

It's embarrassing to admit now, but that's how long I once spent figuring out how to get a box with a dotted line around the key takeaways of my blog post.

This shouldn't be happening anymore...but then I glance at my neighbor's screen in the co-working space and see them struggling with the WordPress editor.

For some, the struggle is still real.

It doesn't have to be! Let me show you how to use Thrive Architect to create stunning blog articles that will keep your readers' attention from the very beginning till the very end.

More...

But I'm Scared to Use a Visual Editor for Blog Posts...

Believe me, I understand.

The last thing you want is for all your hard work to disappear the moment you deactivate a plugin.

And while we hope you'll stay around for the long haul, we made sure deactivating Thrive Architect will NOT delete your content!

Shane wrote an indepth post about the content lock-in problem and how we and other plugins handle this issue.

In short, all of your text will still be there, and so will your images. The only things not preserved are styled elements like content boxes. However, everything will be editable in the normal WordPress editor. So while it might look less "designed," it would still be readable for visitors and you'd still be able to edit it.

There is no risk that your content will cease to exist!

Back-end Vs. Front-end

Thrive Architect is a front-end editor and the WordPress editor is a back-end editor.

This means when you open Thrive Architect on a blog post, you'll see your menu bar, breadcrumbs, sidebar, author box, comment section,... In short, it will look like your website.

You write your article in the editor and will immediately see (without refreshing or previewing) how it will look for your visitor.

Thrive Architect is used for everything related to the actual creation of the article. Other settings like adding a category and tags, adding a featured image, and the title of the article are still done in the back-end of your site.

The Basics of a Structured Blog Post

There is no use putting lipstick on a pig. No amount of visuals will improve an article with bad structure or weak content.

That's why, when you're writing any article, you want to make sure to get the basics right. 

If you need a little help with this, read our article about content patterns where you'll discover how to use content patterns to create blog posts in a structured way, beat writer's block and cut hours from your usual content creation process.

Once you've decided on a structure to follow, it's time to write your outline in Thrive Architect.

For a well structured article, you need the following elements:

1. Headings

Headings have 2 important roles:

  1. Structuring the article for your readers
  2. Structuring the article for search engines

The first one is pretty obvious, having bigger text will capture your readers' attention and allow them to quickly scan the article to read the bits they are interested in.

The second one deals with what happens behind the scenes (in the HTML code to be precise) when you add a heading element to your post.

Readers won't notice the different between a heading element vs a paragraph element with the same font size, for search engines there is a difference.

Using the heading element will add a bit of code indicating to search engines which part of the article is most important.

The title of your article (the one you've added in the WordPress editor) is automatically a heading 1 (the most important element on the page).

And because it's good practice to only have one heading 1 per article, when you add a new heading in Thrive Architect it will automatically be a heading 2 (the second level of importance in your article).

Key Takeaway

Don't change the font size of a paragraph to create visual hierarchy in your articles. Use the heading element so search engines can also understand what's most important.

2. Paragraphs

This is what the majority of the text in your article will be made up of—multiple paragraph elements. 

You'll be able to use the text editor to bold text, italicize text or add hyperlinks.

3. Read More Element

The More Tag element is useful when you show a summary of your article on your blog list page. Check out our blog list page if you want to see this in action.

In order to show only a summary, in your WordPress dashboard go to Settings >> Reading >> Summary.

Now, when you add the 'more tag' element, everything above the element will get shown in your blog list. This give you full control over what's shown and allows you to craft a compelling introduction to make readers want to click and read the full article.

Spice Up Your Article

Now you have the basics in place, so let's make the article more visually appealing.

There is no such thing as a blog post that's too long... Only too boring!

Click to Tweet

1. Images

You read this, didn't you?

The first thing to make an article more visually interesting are images.

These can be screenshots, photos, illustrations in JPEG, PNG or even GIF format. 

Simply drag the image element where you want to show an image and pick (or upload) your image from your media library.

Don't forget to add a caption text. Images attract the eye, which makes the caption text a great opportunity to engage with your reader.

Also, when using (a lot of) images, make sure to optimize them to avoid increasing the loading time of your site. Don't worry, it's easy and we explain how to do it here.

2. Icons

Thrive Architect comes with 3600+ icons

Finding the right image might be time consuming, which is where icons come in.

In Thrive Architect you have access to over 3600 icons

You can even personalize the background and color of the icon to make it look more interesting and to fit your brand.

3. Highlight Boxes

Pre-designed highlight boxes can be found in the Styled Box element.

We loooove hightlight boxes.

They are an excellent way to make an article captivating AND more reader friendly. 

Please start using highlight boxes, your readers will thank you for it!

If you need inspiration on what highlight boxes to add, check out this article to discover 5 types of highlightboxes we believe every blog post should start using.

4. Styled List

Have you seen me geek out with styled lists?

If you did, you know I think styled lists are amazing (and so much fun to create). 

Again, it's an element you can add no matter the topic of your blog post to help structure your article.

If that's not convincing enough, blog posts with a list get twice as many backlinks as text only blog posts.

Key Takeaway

Icons, highlightboxes and styled lists are an easy way to make ANY article visually appealing and more enjoyable to read. 


Save time by creating templates for each one of these elements.

This allows you to customize the element once and use it over and over again.

5. Click to Tweet

By compressing the information in your article into one or more tweetable quotes, you've taken away the hard work for your visitors. This makes it easier for them to share your blog post!  

People like to tweet things that make them look smart.

Tim Soulo - Ahrefs

According to Tim, a tweetable quote has to:

  1. Convey a great idea in one catchy phrase.
  2. Clearly stand out from the rest of your article.
  3. Have a clear call-to-action
  4. Require only one click to tweet

The click to tweet element in Thrive Architect takes care of the last 3, all you have to do is come up with a catchy phrase.

6. Videos

Add responsive videos to your articles

70% of YouTube viewers watch videos to "help with a problem" they're having in their hobby, studies, or job. And 41% feel smarter when watching videos. Source

Why not take advantage of this in your blog posts?

You can embed your own video or leverage someone else's knowledge about a topic.

A Word About Customizations

While Thrive Architect is ideal for adding visual elements and making your blog posts look amazing, it's not the place to customize your heading and paragraph fonts.

Don't get me wrong, it is possible! But I don't recommend it for blog posts.

Blog posts should always look the same. Same font, same font sizes, same font color, etc.

If you're unhappy with the way your headings or paragraphs look as a whole, you should change these settings on theme level rather than individually for each heading or paragraph element. It will save you a ton of time and frustration. 

This is an example of the outside in principle. Which is the most efficient way to create your content. 

This principle states that when applying the same styling to multiple elements, you should apply the styling to the parent container of those elements, starting from the biggest container and working your way to the smallest container.

For headings and paragraphs, the parent container is your theme and you can use the theme customizer to change this.

Changing the settings there will allow you to do once rather than each time you're writing a blog post.

Question? Shoot!

I hope you see the advantage of writing blog posts with Thrive Architect!

I for one would never go back to the normal editor and I'm pretty confident if you give it a try you'll feel the same.

Still have questions? Let me know in the comments below!

by Hanne  September 7, 2018

139

Enjoyed this article ?

You might also like:

Leave a Comment

  • Hanna this is such a great succinct set of guidelines for our blogs. Love the idea of using the icons when images are thin on the ground. Thanks again for another great bit of learning

  • I like very much your explanation. I hope we can even improve with more customization when theme builder is finished.

  • Hi Hanne!

    Great article as always! 🙂

    It would be really great if I can override the typography settings at page level for blogposts and mainly for pages.

    It would be great if I could use that typography options what landing pages have.

    The lack of this feature is not a big problem if I make a blog post, but I’m really missing out when I’m doing a whole website.

    Because in that case the header and footer comes from the main theme, and Thrive Architect turns off the page level typography options and it’s very difficult to work with it.

      • It will be great, I can not wait! 🙂
        But actually no release date for that. 🙁

        The page level typography options would be very helpful as long as the Theme Builder released. And it would be very useful for older sites that have built with any other themes.

        Does this option have any technical barriers?

      • No no release date yet, but we’re working very hard 😉

        We’re not planning on adding this in Thrive Architect cause it would become confusing as soon as the theme builder is released.

  • Question re headings….I recall reading somewhere that you should use H2s sparingly and H3s more liberally. I don’t remember an exact number…do you have any guidance on an ideal # of H2s/H3s to use per post?

    • Hi Nicole,

      I don’t believe there is such a thing (never heard about it). It really depends on the length of your article.
      The main thing is to keep it logical, as you can see in this article, I have 1 H1, 6 H2 et 9 H3 because that’s what the structure of the article needed (in my opinion 😉 )

  • Super, again something new to learn from architect! I didn’t know, that I can switch off the red marks in the text … 😉 Thank you.

  • great content as always. One thing that I like very much is the table of contents you did in the introduction of this “blog post”… Love this because it increases dwell time, interaction with the post itself and is superb from a UI perspective.

    Would you mind sharing how you do it (looking at Thrive I always assume some Thrive architect magic behind it *lol*)

    • It is! It’s the “table of content” element 😀
      Just make sure to use headings (H2/H3/H4) etc. and the table of content will show your headings and sub headings.
      Takes about 1 second to add to your blog post 😉

  • Great Tutorial Hanne,
    my question is: would you recommend a blog like many blogs are with a column at the right? If yes, why? I’m asking, because I think it’s better / nicer to have the blog post over the whole width. What are the preferences in this regard in a modern blog? Thanks!

    • Hi Andrea,

      I think this is mainly preference/design trends. Since Medium became more popular, we’ve seen more and more full width blogs (without the sidebar).
      I personnally prefer that too because it looks cleaner.
      From a conversion point of view, it’s worth testing. We’ve noticed that only very few people click when we add an image in the sidebar and opt-in conversions are really low too so I wouldn’t mind removing the sidebar when doing a design makeover of the site.
      But some websites might benefit from having a sidebar (eg. when you’re selling advertising space).

      As a good rule of thumb, you should keep your visitor in mind. What do you want them to do when they arrive on one of your blog posts? Is is more important that they read the content (and maybe click on links in the content) or do you need the sidebar to advertise?

  • Very persuasive tutorial, Hanne!

    I’ve always avoided using page builders for my blog posts, because I write all my text outside of WordPress, and usually in markdown.
    I can then just paste it into the WordPress editor to get a fully formatted post.

    It would be great to have the best of both worlds though:
    How would Thrive Architect cope if I pasted in my text and then switched to the front end editor? Or if I went to edit a published post?
    Would it be able to split text into headings and paragraphs automatically, or would I have to paste them in individually?

    • Hi Tim,
      That’s a bit tricky. You can not “mix” the text in the WordPress editor and Thrive Architect, so if you paste it in the back-end WP editor you will see it in the front-end but you won’t be able to edit it there.

      • Hmm, that’s a shame as it breaks my workflow.
        I’ll have to think carefully whether to use Architect instead.

        Any possibility of a feature request that would allow Architect to interpret the HTML of the post and split it into the headings, paragraphs and images in the front end editor?

      • Hi Tim,
        It’s something we’ve been thinkinf of, but it’s not super high on the priorities list atm

  • Hi Hanne,
    Forst of all man Tanks for your clear and comprehensive yet short Blog Post. My question is, how can I put a “click to share” Button for sharing a quote or so on facebook or via whats app? Twitter is ok, but sharing a good quote in fb as well will habe greater impact/reach.
    Thank you for an answer in advance!
    Regards, Günter

    • Hi Günter,
      We have a Share element that allows you to add share buttons (for Facebook) but it will only share the URL, not the quote.

      I don’t have a solution for what you’re trying to do at this moment.

  • Great tutorial! Very inspiring. I’m wondering what I need to keep in mind for my blog feed when using TA as the editor. Will content boxes, click to tweet boxes, and styled lists and things show up as designed in my RSS feed?

    • Hmm good question… My first guess would be “no” because I think it strips CSS formatting but than again it might depend on the reader. Sorry but I’m not sure.

  • Thanks Hanne! I would love to edit directly in the architect. I use Yoast SEO and it does not seem to work with Thrive Architect editor. I edit my content in WP to get the SEO good, then copy/paste to Thrive Architect. (I hate this process by the way.) Any recommendations on how I can do this better?

      • Thanks for the response. Yoast SEO will highlight the text that it finds issues with. I use this feature extensively as I write (especially since I tend to write passive voice). The SEO tool highlights the text in the WP editor, but I do not see that in Thrive Architect. Am I missing something?

      • Hi Steven,

        Ok I thought you were just using the score. Didn’t know Yoast highlighted text. I don’t believe that will work.

      • Any update on this Hanne? The highlight feature is very handy and a pain to switch back and paste to Thrive Architect.

  • Hanne, great tutorial with many creative tips to use here. The
    link to the youtube stats page is also very interesting reading. Many thanks for this post.

  • Hanne – what about web form styling? They’re so important but I didn’t see anything about it in your post. I once saw something about styling Contact Form 7 forms in one of your blog posts. Is that correct?

    Thanks.

    • Hey Stefanie,
      If you simply want a link, you can use a button or text and add the link. If you want an audio player, you would need to use a plugin or an embed link (if you use a platform like SoundCloud to host). If you use an embed link, you can use the “WordPress content” element to add it to your post there where you want it.

  • I used to love writing my blog posts in the Thrive editor but had to stop and convert my posts back to normal WordPress posts. Unfortunately, because Thrive wraps each paragraph and other blocks in a div instead of paragraph HTML tags it doesn’t work well with ad companies.

    I’m with Mediavine one of the big blogger ad companies and they are only able to target posts written in one format or the other. Since there are also no recipe plugins that work inside the Thrive editor there is no way that I could have moved all of my posts into the Thrive editor format. 🙁

    I really wish you guys could make it so the FULL WordPress editor window was used when you click the WordPress content option from inside the editor. There are so many helpful plugins like recipe ones, Amazon affiliate plugins etc. that would then be usable. The way it is now most of them are blocked from loading.

    That or changing to using paragraph tags around text boxes. Either of these would be a big help!

    I still use Thrive Architect to make my pages, and I use it on some of my blogs that don’t need recipes or other plugins but I would love to be able to start using Thrive to write all of my posts again. It’s so much nicer looking!

  • Hanne, this has helped so much thank you! Thrive Architect can be a bit overwhelming and I spend so much time writing, I don’t have time to ‘learn’ Thrive Architect.

    These videos are really helpful. Thank you

  • Great Tutorial! But I have a question, when I used to write using the normal WordPress editor I used to have Grammarly which helps me a lot fixing my grammar mistakes, Grammarly does not support Thrive Architect and now my posts have more grammar mistakes which Grammarly used to spot for me, can you please suggest any tool like Grammarly that supports Thrive Architect? Thanks a lot and keep up the great work!

  • Hanne, thank you for such a great video — love how you explain all those details so clearly. You make things so much easier to get done! This info came at the right time for me. I can’t wait to start using this for my blog.

  • Wonderful article. Another great addition to thrivethemes would be a readymade blog post template. This way we can have all the basic elements/structure of writing great blog post without thinking about all the steps or spicing up the content. Additionally we can add or edit our content according to our needs. This blog post template would save a lot of time. Does anyone agree???

    • Hi Chetan,

      Thanks for the suggestion, one thing you can already do is create your own templates and save them (to to page settings and save as template) 🙂

      • Hi Hanne,

        Do you mean we can create our own blog page templates including editing sidebars/sidebar widgets with Thrive Architect? I haven’t seen a way to do this yet. Elementor allows this I believe, but I like that Thrive comes bundled with everything. Only thing I’m not a fan of are the Thrive theme’s blog post templates and wouldn’t mind being able to edit them if possible? I’m using Squared at the moment.

        Thanks
        Al

      • Hi Al,

        This will be part of Theme Builder (which is currently in Beta testing)