May 19, 2017

How to edit instant article code

Normally, after we publish the article in blogger already we have to change some code in instant article to make our article in Facebook good view and pop up any Ads within. This some tip when we change the code with this sample.

1. Head Tag <head>...</head>
    <meta charset="utf-8">
    <meta property="fb:article_style" content="V1">
    <meta property="fb:use_automatic_ad_placement" content="true"/>

Copy all above code and pasts in the  <head> tag
What we need to edit is: 
Content use your style which create in the configuration of instant article (in this Style I use my style name "V1").

2. Header Tag <header>...</head>
    <time class="op-modified" datetime="2017-04-11T09:04:00-07:00">2017-04-11T09:04:00-07:00</time>
    <time datetime="2017-04-11T09:04:00-07:00" class="op-published"></time>
    <h1>Update Your Window 10 with Window 10 Update Assistant</h1>
    <figure><img border="0" src=""></figure>
    <figure class="op-ad">
      <iframe width="300" height="250" style="border:0; margin:0;" src="">        </iframe>

What we need to edit is: 
In <h1> tag in the title of article
In <address> tag mean that wrote by who
In <figure><img border….  line  (To show image at the top of article in Facebook instant article you can copy image code from the image in the body code.
In <figure class=“op-add”> copy code from your Audience Network placement code

3. body tag
<a href="" imageanchor="1" style="margin-left: 1em; margin-right: 1em;">
<figure><img border="0" height="640" src="" width="480"></figure>


Please don't forget Like and Share