How to use Live Blog’s SEO features

by Helmy Giacoman |  November  1, 2021

One of the key advantages of having a live blog for digital publishers is the SEO boost that real-time news coverage provides. In this post we look at the technical side of SEO in our Live Blog platform and explain how you can make the most of this in your settings and on your website.

Part 1:  ESI and SEO

First, let’s take a look at what Live Blog is, and how it relates to your other content. In essence, Live Blog is a curated timeline of news updates marked with a timestamp. In technical terms it is a group of HTML elements that can be embedded into third-party websites by using an embed code, which takes care of loading that curated timeline of news into the host website.

To host their live blog, many publishers use an iFrame embed code – an HTML element that is used to insert content from a third-party source – which is the quickest way to integrate content from Live Blog into their website. For users coming to the host website, there is no visible difference between Live Blog and any other content.

Here is an example iFrame embed code:

<script src="https://test.liveblog.pro/embed.js" defer></script>
<iframe id="liveblog-iframe" width="100%" scrolling="no" 
src="https://test.liveblog.pro/lb-test/blogs/6172fcbdab5f4af0268694e2/index.html" 
data-responsive="yes" frameborder="0" allowfullscreen></iframe>

For search engines, however, the iFrame element (officially called an Inline FRAME) used by default by Live Blog makes the content unreadable and, as a result, does nothing to improve the quality and quantity of your website traffic. That’s because the iFrame is like an envelope, and the Live Blog is like the letter inside. If you want the postal service (i.e. search engines) to read the letter, you have to provide them specific instructions to do so.

The way we recommend to open the envelope and present the letter is by activating the Live Blog advanced ESI (edge-side include) feature  in your theme settings.

To activate the ESI option, follow these steps:

  1. Log in to your Live Blog instance and click on the burger menu on the top left to open the “Theme Manager.” 
  2. Open the “Settings” dialogue of your theme (based on the default theme) and switch on the option to “Optimise the Live Blog output for ESI.” 
  3. Your output will now be rendered in a way that it can be included right into your webpages making use of ESI technology. Please note that if switching on this option, the output will not work properly as a normal iFrame embed anymore, since we are removing some markup from the output that is required for this purpose. 

After switching on the rendering for ESI, the markup of the “LIVE” output will change and editors can copy the respective URL and put it into their articles to be handled by ESI. The URL can be found in your general settings under “embed code” and look will something like this:

<script src="https://test.liveblog.pro/embed.js" async defer></script> 
<esi:include src="http://test.liveblog.pro/lb-test/blogs/6172fcbdab5f4af0268694e2/index.html"/>

Part 2: Configuring your servers

Now comes the more technical part. Many websites use a caching engine – such as Varnish – which sits in front of a server to deliver content and balance load. After toggling on the ESI embed feature in your Live Blog instance, the next step is to work with your infrastructure team to configure the backend of your website, including any caching engine, to recognize this ESI content. 

Fortunately, most developers will be able to do this rather quickly. But If you need tips or have other questions about Live Blog, get in touch with our support team at the Live Blog help desk.

Looking for a better live blogging solution? Try out Live Blog from Sourcefabric for seven days free, no strings attached. Get your trial version here.

Ready to begin liveblogging?

Getting started has never been easier.