Showing posts with label Tutorial. Show all posts
Showing posts with label Tutorial. Show all posts

How to Make a Widget Only Shown on Homepage Blog

Blogger Widget

How to Make a Widget Only Shown on Homepage Blog - Homepage is the main page of the website / blog, on this occasion we will discuss how to make the widget appear only on the homepage. To be dynamic and blogs seem neat, preferably some widgets that are considered essential and are only displayed on the main home page or homepage.
You want to make widgets appear only on the main page / homepage, follow the following steps:

1. Login to blogger.
2. Choose Template => Edit HTML => Expand Widget Templates checkbox.
3. Do not forget to backup templates so you can easily restore if something goes wrong.
4.'s Widgets use F3 or Ctrl + F. Example widget: Latest Articles.

<b:widget id='HTML5' locked='false' title='Latest Articles' type='HTML'>
<b:includable id='main'>
<!-- only display title if it's non-empty --&gt
; <b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
<b:include name='quickedit'/>
</b:includable>
</b:widget>

5. Put the code <b:if cond='data:blog.url == data:blog.homepageUrl'> under <b:includable id='main'> and </b:if> above code </b:includable> as follows:

<b:widget id='HTML5' locked='false' title='Latest Articles' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
<b:include name='quickedit'/>
</b:if>
</b:includable>
</b:widget>

6. Then save the template
LEARN MORE

How to Make a Widget Only Appear On The Blog Posts

Blogger Widget

How to Make a Widget Only Appear On The Blog Posts - My Backlink this time will share a tips-tricks that only serves to show the widget on the blog post page. Illustrations like this, at some point we feel should install a widget which we think is important and must be present on our blog, but on the other hand, the home-page page has been cluttered and if imposed, it would be more chaotic and confusing. Well here is the method to show a widget only on the pages of blog posts into a workable solution to overcome these problems.

How do I make it? Not too difficult, but it requires precision and patience, because we have to add a script to the html-template blog series we are so in length and complicated, one can slightly damaged all blogs arrangements that we have built with such difficulty.

In this article I pointed to put Widgets Related Articles only on post pages. The original script is as follows widgets.

<b:widget id='HTML1' locked='false' title='Related articles' type='HTML'>
<b:includable id='main'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
<b:include name='quickedit'/>
</b:includable>
</b:widget>


To achieve such purposes we only need to add 2 additional course code or script that is <b:if cond='data:blog.pageType == &quot;item&quot;'> and </ b: if>, so that the configuration script into seperrti this:
<b:widget id='HTML1' locked='false' title='Related articles' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
<b:include name='quickedit'/>
</b:if>
</b:includable>
</b:widget>
LEARN MORE

How to Enable Ads.txt in Blogger

Blogger Now Already Supported Ads.txt

My Backlink - After Google introduced the search console beta version, it's now finally Google or Blogger releases ads.txt directly on the Blogger dashboard on January 31, 2018.

Ads.txt is an initiative of the Interactive Advertising Bureau Tech Lab (IAB) to promote and improve transparency in program advertising. This is an easy way for Adsense publishers to clearly point out to authorized buyers to sell their inventory.

Actually for Blogger Ads.txt already existed but now you can edit Ads.txt as you like and for you who get warning message like this.

Your earnings are at risk - One or more of your ads.txt files do not contain the AdSense publisher ID. Fix this issue right now to avoid having a serious impact on your revenue.


To enable Ads.txt on Blogger, you can set it in Blogger Dashboard > Settings > Search preferences > Monetization > custom ads.txt > Then click edit select Yes and fill in the following code in the column ads.txt.

How to Enable Ads.txt on Blogger

google.com, pub-0000000000000000, DIRECT, f08c47fec0942fa0


Please replace pub-0000000000000000 with your Adsense ID, then click Save changes.

Adsense ID can be found in Blogger dashboard or Google Adsense buddy like the example below.

How to Enable Ads.txt on Blogger

How to Enable Ads.txt on Blogger

To check whether Ads.txt is enabled, you can check in the browser search tab with links like this.

 http://www.your_domain.com/ads.txt

Replace your_domain with your blog address.

We suggest you activate ads.txt manually in all of your blogs from bloogers serving Adsense ads to ensure that we have activated ads.txt with the account currently in use, as in the tutorial above.

Similarly about How To Easily Enable Ads.txt on Blogger.

Good luck
LEARN MORE

Create Ads AMP 970x250 With Show Hide Ad Button

Adsense Billboard 970x250

MyBacklink86 - This is inspired by billboard adsense on Youtube, just check out the adsense at the top of the Youtube page of 970x250 billboard ad unit.

And there is no harm we try to experiment with this billboard advertising unit, who knows his rea is in the unit.

And it seems still not many bloggers who use this 970x250 billboard advertising unit, probably because of its large size so it takes up a lot of space on the blog.

For that, this ad unit we are equipped with show hide ad button, so if there are visitors who feel annoyed with this slot then the ads can be hidden as well as on the Youtube page also use the show hide ads button.

If you want to try it, please follow the steps below.

Please save the CSS code under the place above ]]></b:skin>.

/* Top Banner */
.top_banner{margin:20px auto;padding:0 10px 20px;position:relative;width:100%;max-width:990px;height:auto}
#close_topbanner,#open_topbanner{font-family:Roboto,sans-serif;position:absolute;padding:0;bottom:0;background:0 0;border:none;cursor:pointer;color:#888;font-size:15px;font-weight:500;height:20px;line-height:20px;}
#close_topbanner{right:10px}
#open_topbanner{width:100px;text-align:center;right:50%;margin-right:-50px}
#close_topbanner:focus,#open_topbanner:focus{outline:0}

Then please save the code below and place it after the code. <body>

<b:if cond='data:blog.pageType != &quot;static_page&quot; and data:blog.pageType != &quot;error_page&quot;'>
<div class='top_banner'>
<div id='topbanner'>
<amp-ad data-ad-client='ca-pub-xxxxxxxxxxxxxx' data-ad-slot='xxxxxxxxxx' height='250' layout='fixed-height' type='adsense'>
 </amp-ad>
  </div>
<button id='close_topbanner' on='tap:topbanner.hide, close_topbanner.hide, open_topbanner.show' role='button' tabindex='0' title='Close'>Close Ad</button>
<button hidden='' id='open_topbanner' on='tap:topbanner.show, close_topbanner.show, open_topbanner.hide' role='button' tabindex='0' title='Open'>Open Ad</button>
  </div>
</b:if>

Please customize the code <data-ad-client='ca-pub-xxxxxxxxxxxxxx' and data-ad-slot='xxxxxxxxxx' with your responsive ad unit.

And make sure you've installed js amp-ad on your blog.
LEARN MORE

Create a Youtube AMP Video Playlist On AMP Blog

Youtube Video Playlist AMP

Live Demo Here

My Backlink - Sometimes a Blogger needs to display a Youtube video playlist on the blog, be it a music video playlist, video tutorial, or other video.

For non AMP blogs, to display youtube video playlist, can use the embed code provided by Youtube which formatted iframe code.

But for blogs that use AMP HTML, to display Youtube video playlist there are 2 ways that is by using amp-youtube and amp-iframe.

Video embed code provided by Youtube is usually as below.

<iframe width="560" height="315" src="https://www.youtube.com/embed/videoseries?list=PLI7-RQrPntL1sK7bbBVJHlO8zJjkTxofX" frameborder="0" gesture="media" allowfullscreen></iframe>

The marked code is the embed URL of the Youtube playlist.

First you have to do is place the JS AMP Youtube code below inside <head>

<script async custom-element="amp-youtube" src="https://cdn.ampproject.org/v0/amp-youtube-0.1.js"></script>


Well to display the Youtube playlist in AMP HTML with amp-iframe actually I've discussed in the postlist video playlist Youtube for AMP HTML blog, please make it like this.


<amp-iframe width="560"
      height="315"
      layout="responsive"
      sandbox="allow-forms allow-scripts allow-same-origin allow-modals allow-popups"
      frameborder="0"
      allowfullscreen="allowfullscreen"
      src="URL_EMBED_PLAYLIST_YOUTUBE">
  </amp-iframe>

Please replace URL_EMBED_PLAYLIST_YOUTUBE with the URL of the embed Youtube playlist above the one I marked.

But to watch Youtube video playlists using amp-iframes, playlist with amp-iframe should be stored approximately 75% from the top edge of the screen when the page first opened before scroll, and make sure it has js amp-iframe installed.

Read Also:
Create a responsive youtube video on Non AMP blog

Create youtube video autoplay and no autoplay on AMP blog

Create youtube video autoplay on blog No AMP blog


And to display a playlist of Youtube videos using amp-youtube, please see the code below.

<amp-youtube
      width="480"
      height="270"
      layout="responsive"
      data-videoid="ID_VIDEO"
      data-param-listType="playlist"
      data-param-list="ID_PLAYLIST">
  </amp-youtube>

ID_VIDEO please replace with your youtube video ID and replace also ID_PLAYLIST with ID of your youtube video playlist, , for example the code below.

https://www.youtube.com/watch?v=QhxU_95FXY8&list=PLI7-RQrPntL1sK7bbBVJHlO8zJjkTxofX


For example as below:

<amp-youtube
      width="480"
      height="270"
      layout="responsive"
      data-videoid="QhxU_95FXY8"
      data-param-listType="playlist"
      data-param-list="PLI7-RQrPntL1sK7bbBVJHlO8zJjkTxofX">
  </amp-youtube>


With amp-youtube we can display youtube videos anywhere either above or below post, and make sure you have js amp-youtube installed on your blog.

Hope this article useful to you and good luck.
LEARN MORE

Creating Parallax Adsense In Blogs Non-AMP

Creating Parallax Adsense In Blogs Non-AMP

MyBacklink86 - We can create parallax ads on AMP blogs easily with the help of js amp-fx-flying-carpet.

Of course it will not work on non AMP blogs because it's specifically for blogs with AMP templates.

So what if we want to create a parallax ad on non AMP blog?

Parallax ads can be for banner image, ads with iframe and for adsense.

If you want to try it, please you follow the steps below.

Please save the code below and place it above </head>

Click
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type='text/css'>
/*<![CDATA[*/
.paralax_div {
  position: relative;
  overflow: visible;
  width: 300px;
  height: 250px;
  margin-right: 20px;
  display: inline-block;
  float: left;
  z-index: 9999;
}
.paralax_div > div {
  overflow: hidden;
  width: 100%;
  height: 100%;
  margin: 0;
  position: absolute;
  top: 0;
  left: 0;
  clip: rect(auto auto auto auto);
}
.paralax_div > div > div {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  margin: 0 auto;
  -moz-transform: translateZ(0);
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  -o-transform: translateZ(0);
  transform: translateZ(0);
}
.paralax_div > div > div > div {
  width: 100%;
  height: 100vh;
  position: absolute;
  left: 50%;
  top: 0;
  border: none;
  -moz-transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  transform: translateX(-50%);
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-align-content: center;
  align-content: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  background: #ddd;
}
.paralax_div > div > div > div > * {
  margin: 0;
  margin-top: 0;
}
.paralax_div > div > div > div > a {
  width: 100%;
  height: 100vh;
}
.paralax_div img,.paralax_div iframe,.paralax_div ins {
  height: 600px;
  width: 300px;
}
.clear {
  clear: both;
  display: block
}

@media screen and (max-width:640px) {
  .paralax_div {
    width: 100%;
    height: 250px;
    margin: 0 auto;
    float: none;
  }
  .paralax_div > div > div > div {
    left: 50%;
    -moz-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
  }
  .paralax_div > div > div {
    width: 100%;
    left:0;
    text-align: center;
  }
  .paralax_div img {
    margin: 0 auto;
    width:auto;
    max-width:100%;
    height:auto;
  }
}
@media screen and (max-width:320px) {
  .paralax_div iframe,.parallax_banner ins {
    margin: 0 auto;
    width:100%;
    height:600px;
  }
}
/*]]>*/
</style>
</b:if>

Then save the code below and place it above this code <div class='post-body entry-content' ........

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class="paralax_div">
  <div>
    <div>
      <div>
        <img src="https://4.bp.blogspot.com/-RzxVWJw3Uho/WcKesObgvwI/AAAAAAAAEsg/-5IWkUTJIAYacQNaGvc0bqbXl2Svy35xQCLcBGAs/s640/Adsense%2BIn%2BThe%2BMiddle%2BOf%2BBlog%2BArticles.png" alt="banner" width="300" height="250" />

      </div>
    </div>
  </div>
<span class="clear"/>
</div>
</b:if>

If you use it for your image banner ads (banner with height 600px and width 300px), please replace the url image in the code above.

If you use to ad code with iframe or adsense (300x600 ads), please remove the <img> tag above and replace your adsense code.
LEARN MORE

How to Make Easy Youtube AMP Video on Blog

How to Make Easy Youtube AMP Video on Blog

MyBacklink86 - In this post my backlink will share how to make Youtube AMP video on AMP blog.

If you have a video on Youtube and you want to display it on your blog then you can make a Youtube video and save embed youtube video playlist on your blog.

If you are using AMP blog, you can also display Youtube AMP video by using Youtube AMP code.

Please follow how to make youtube AMP video below.

1. Please put this code just below <head> code.

<script async custom-element="amp-youtube" src="https://cdn.ampproject.org/v0/amp-youtube-0.1.js"></script> 

Example
<head>
<script async custom-element="amp-youtube" src="https://cdn.ampproject.org/v0/amp-youtube-0.1.js"></script>
.......
.......
</head>
</body> 

2. Show Youtube AMP video singles on your AMP blog please use the code below.

No Autoplay

Embed YouTube videos via the video id. The id is found in every Youtube video page URL.

<amp-youtube width="480" height="270" layout="responsive" data-videoid="VIDEO ID HERE">
</amp-youtube>


Replace VIDEO ID HERE with your Video Youtube ID (data-videoid = "VIDEO ID HERE")

Autoplay

Setting autoplay will automatically play/pause the YouTube video as it is scrolled into/out of view on supported browsers.

The YouTube video is automatically muted before autoplay starts, when the user taps the video, the video is unmuted.

If the user has interacted with the YouTube video (e.g., mutes/unmutes, pauses/resumes, etc.), and the video is scrolled in or out of view, the state of the video remains as how the user left it.

<amp-youtube width="480" height="270" layout="responsive" data-videoid="VIDEO ID HERE" autoplay></amp-youtube>


Replace VIDEO ID HERE with your Video Youtube ID (data-videoid = "VIDEO ID HERE")

This code can be stored in your blog widget or in your blog post.

Make it easy to implement Youtube AMP code in Blog.

Hope this article useful to you.

Good luck
LEARN MORE

How To Create Adsense In The Middle of Blog Post

Adsense In The Middle of Blog Post

MY BACKLINK - In this post my backlink discuss about tutorial how to install adsense in the middle of blog post. Actually there are so many articles that discuss about this tutorial, but coincidence in this blog has not been discussing this tutorial so I make this tutorial post to you.

The benefits of tutorial install adsense in the middle of this blog post that you can further increase Google Adsense revenue on your blog with a higher clickthrough rate and usually will more interest to readers with ad content that is displayed because of the position of a strategic ad in the middle of the blog post .

Here's how to install adsense in the middle of blog posts

The way is very easy, here you just need to replace the specific code in the template and replace it with the code that I will give in the guide below.

1. Please login to Blogger and select the blog you want to edit.

2. Click the Template menu, click the Edit HTML button, then search and replace this code <data:post.body/> in your template with the code below.

Read also How to Install Google AdSense In-Feed Ads on Blogger

Inside the template you will find some <data:post.body/> code depending on the template you are using, try it one by one until the ads appear in the page of your blog article.

Adsense In The Middle of Blog Post

Read also How to Create an AMP Adsense Unit on Blogger


<div expr:id='"ads1" + data:post.id'></div>
<div style="clear:both; margin:10px 0">
SCRIPT ADSENSE THAT HAS BEEN DIPARSE
</div>
<div expr:id='"ads2" + data:post.id'><data:post.body/></div>
<script type="text/javascript">
var obj0=document.getElementById("ads1<data:post.id/>");
var obj1=document.getElementById("ads2<data:post.id/>");
var s=obj1.innerHTML;
var t=s.substr(0,s.length/2);
var r=t.lastIndexOf(" ");
if(r>0) {obj0.innerHTML=s.substr(0,r);obj1.innerHTML=s.substr(r+1);}
</script>

Please note, the above script will place the ad exactly in the middle of the post, or in other words, the script will count all the words in your article and divide it into 2 (see the code line var t=s.substr(0,s.length/2);), then insert ads at that point.

To parse the Adsense code, can use this tools parse here.

3. Save the template and see the results.

Well, please apply the tutorial how to install adsense in the middle of this blog post on your blog. Hopefully will be able to improve CTR ads on your blog.
LEARN MORE

How to Install AdSense In-Feed Ads on Blog

How to Install Google AdSense In-Feed Ads on Blogger

For a demo of Google AdSense In Feed Ads please see your home page MY BACKLINK

MY BACKLINK - After some time rarely update on this blog on this occasion Arlina Design will share the installation of the latest features of Google AdSense, which features In-Feed Ads ad units that can be installed on the blog. This ad unit is quite interesting, because it will be installed between the list of articles following the form of customizable post layouts.

For those of you who want to add this feature you can follow the following simple steps.

How to Install Google AdSense In-Feed Ads on Blogger


First, open your Google Adsense dashboard. Click the My ads > Content > Ad units > Then click the button New ad units


Next select in-feed ads

How to Install Google AdSense In-Feed Ads on Blogger

In the next step please select one type of display according to your blog.

Next step, go to Blogger dashboard > Themes > Click the Edit HTML button > Find the code below

<b:loop values='data:posts' var='post'>


Replace the code into the code below

<b:loop values='data:posts' var='post' index='x'>

Note: do not forget to back up your blog template first.

Next look for this code

<div class='post-outer'>


Add the code below just below the code in the step above <div class='post-outer'>.


<b:if cond='data:blog.pageType != &quot;static_page&quot; and data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:x==1'>
<div class='post'>
YOUR CODE SCRIPT NATIVE ADS
</div>
</b:if>
<b:if cond='data:x==3'>
<div class='post'>
YOUR CODE SCRIPT NATIVE ADS
</div>
</b:if>
</b:if>


Then the result will be like this.


<div class='post-outer'>...</div>
<b:if cond='data:blog.pageType != &quot;static_page&quot; and data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:x==1'>
<div class='post'>
YOUR CODE SCRIPT NATIVE ADS
</div>
</b:if>
<b:if cond='data:x==3'>
<div class='post'>
YOUR CODE SCRIPT NATIVE ADS
</div>
</b:if>
</b:if>


Replace YOUR CODE SCRIPT NATIVE ADS with your In-Feed Ads ad code, save the template and see the results.
LEARN MORE

How to Create an AMP Adsense Unit on Blogger

Adsense AMP

MyBacklink86 - When new to AMP HTML, it's hard to place the right Adsense ad unit on the AMP blog.

And now Google has given an explanation about the placement of Adsense ad units for AMP HTML blog. And after I try, ad units can look great on all device sizes.

If you are still confused in placing an ad unit Adsense on AMP blog, please refer to this post to complete.

Usually the code of an Adsense ad unit will look like below :


<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>

<ins class="adsbygoogle"
   style="display:inline-block;width:120px;height:600px"
   data-ad-client="ca-pub-1234567891234567"
   data-ad-slot="1234567890"></ins>
<script>

(adsbygoogle = window.adsbygoogle || []).push({});

</script>

The code marked above is the code needed for the amp ad unit.

For Top Display (Above The Fold)



The top-of-the-fold display is the screen display once the blog is open (the first view is visible before the screen is scrolled down). For ad units on this top view screen (such as an ad below the header), it is highly recommended to use a ad unit fixed-height 100px (the width of the ad will follow its width, while the height will remain 100px). That way, the ads that show up are ads with a height in the 100px range.

Please use the amp ad code as below



<amp-ad
layout="fixed-height"
height="100"
type="adsense"
data-ad-client="ca-pub-1234567891234567"
data-ad-slot="1234567890">
</amp-ad>

Use the data-ad-client and data-ad-slot of your Adsense ad units.

For On-Screen Display Ads On-Scroll (Below The Fold)



Below the fold is the screen that appears after the page is scrolled. Usually these ads are stored under posts or above and below comments.

For this ad it is recommended to use an ad unit with a height of 250px. Here I use layout="fixed-height" so the ads that appear are ads that are high in the 250px range.

Please use the code amp ad as below


<amp-ad
layout="fixed-height"
height="250"
type="adsense"
data-ad-client="ca-pub-1234567891234567"
data-ad-slot="1234567890">
</amp-ad>

Use the data-ad-client and data-ad-slot of your AdSense ad units.

And make sure you've installed js amp-ad below </head> .


<script async custom-element="amp-ad" src="https://cdn.ampproject.org/v0/amp-ad-0.1.js"></script>

LEARN MORE

How To Make Youtube Videos Responsive in Blog

Youtube Videos Responsive

MyBacklink86 - YouTube is a video sharing website The most popular today is where my friend can upload videos, watch videos, or it could be to generate revenue from youtube adsense account by registering via youtube.

Many advantages offered by this youtube sites, one of which is the video embed feature that can mate to add and can be viewed directly on the blog. However, by adding the video will reduce the value of SEO blog because the iframe element and the zoom was not responsive if the screen size is reduced.

In this article My Backlink will give a youtube video tricks to become responsive and will not reduce the value of SEO blog. Here's how its application:

1. Go to Blogger >> Template >> Edit HTML >> Add the code below before the ]]></b:skin> or </style>


/* Youtube Responsive */
.videoyoutube{text-align:center;margin:auto;width:100%;}
.video-responsive{position:relative;padding-bottom:56.25%;height:0;overflow:hidden;}
.video-responsive iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:0}

2. Add the following code before the </body>

<script type='text/javascript'>
//<![CDATA[
// Youtube Responsive
setTimeout(function(){$(".video-youtube").each(function(){$(this).replaceWith('<iframe class="video-youtube loader" src="'+$(this).data("src")+'" allowfullscreen="allowfullscreen" height="281" width="500"></iframe>')})},5e3);
//]]>
</script>

3. Save Template

4. Next to the add video in the sidebar or post blog, use the code below:

Youtube Videos Responsive



<div class="videoyoutube">
<div class="video-responsive">
<div class="video-youtube loader" data-src="//www.youtube.com/embed/gWG-_WQz3qM">
</div>
</div>
</div>

Examples of link embed youtube video :

Youtube Videos Responsive


Copy the embed youtube link like the screenshot above, and then store them in your HTML code above.

For responsive youtube video codes you can apply in the sidebar of a blog or in a blog post, all according to your wishes which you want to post your blog responsive youtube video.
LEARN MORE

How To Make Responsive Floating Ads with Close button in Blog

Responsive Floating Ads

MyBacklink86 - This time My Backlink will give a tutorial on how to advertise drift (Fixed banner ad or text) that has been unresponsive to additional blog the close button below.

Most people start a blog as a hobby, but there is also the purpose to make friends, increase sales online store, make money and so forth. As a means of supporting the activity of blogging, my friend can put advertising space on the blog to help advertisers promote their products.

Banner ads that float with additional buddy close button may often encounter in a blog or forum that installed it. The close button serves as an alternative if the visitor was annoyed because he had read the content was blocked by floating banner.

Responsive Floating Ads

Here's How to Install Floating Ads Responsive with Close Button :

Go to Blogger >> Template >> Then add the following code before the </body>

<script type='text/javascript'>
$(document).ready(function() {$(&#39;img#closed&#39;).click(function(){$(&#39;#bl_banner&#39;).hide(90);});});
</script>
<div id='fixedban' style='width:100%;margin:auto;text-align:center;float:none;overflow:hidden;display:scroll;position:fixed;bottom:0;z-index:999;-webkit-transform:translateZ(0);'>
<div><a id='close-fixedban' onclick='document.getElementById(&apos;fixedban&apos;).style.display = &apos;none&apos;;' style='cursor:pointer;'><img alt='close' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQ5VRRilwJ4mw1y6mPbx1TsXhMi3zENq9pOtmXwPubQWt8i0gObA-RuOkjxxqQtmjD2APVFJunmxSbmCjSs4dtDeubm_Tw65NzL89kn8uy-ptDxgFpRdo8Ao6ndBFw19cqcu8oQze3kPxv/s1600/btn_close.gif' title='close button' style='vertical-align:middle;'/></a></div>
<div style='text-align:center;display:block;max-width:728px;height:auto;overflow:hidden;margin:auto'>
<a href='#' title='Banner ad here'><img style='max-width:100%;height:auto;vertical-align:middle;' alt='Banner iklan disini' src='http://3.bp.blogspot.com/-9h86Fhn6zZU/VhtxRDTM4qI/AAAAAAAADK0/fQN3Z00kWwk/s1600/arlina-tea.png'/></a>
</div>
</div>

Change width and banner ads on the code marked according to your wish.

Save Template

Note:
Responsive Floating Ads is very good for use on a mobile site to see.
LEARN MORE

How to Install Widget Recent Post Responsive Slider in Sidebar Blog

Widget Recent Post Responsive Slider in Sidebar Blog

MyBacklink86 - This post I will provide a tutorial that is not less cool with the previous tutorial article, which is about how to Add Recent Post Responsive Slider in Sidebar Blog. Widget Recent Post Slider This is quite interesting because it brings up a list of the latest articles slider with thumbnails and effects that will continue to run automatically. Not only that, this widget can also be arranged to bring the latest article by label our blog.


This widget fits written in the blog sidebar pages, because the size is just right to put on the sidebar. Okay, the rest follow the following tutorial.


READ ALSO:
How to Make Recent Post Thumbnail Grid Display Responsive


Add Widgets Recent Post Slider in Sidebar


1. Go to Blogger & gt; Layout & gt; Create a new widget HTML / Javascript & gt; Then copy the code below in it


<style scoped="" type="text/css">
ul.rcentside *{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box }ul.rcentside{font-size:11px}ul.rcentside,ul.rcentside li{margin:0;padding:0;list-style:none;position:relative }ul.rcentside{width:100%;height:500px }ul.rcentside li{height:24.5%;position:absolute;padding:0;width:49.5%;float:left;overflow:hidden;display:none }ul.rcentside li:nth-child(1),ul.rcentside li:nth-child(2),ul.rcentside li:nth-child(3),ul.rcentside li:nth-child(4){display:block }ul.rcentside img{border:0;width:100%;height:auto}ul.rcentside li:nth-child(1){width:100%;height:49.5%;margin:0 0 2px;left:0;top:0 }ul.rcentside li:nth-child(2){left:0;top:50% }ul.rcentside li:nth-child(3){left:50.5%;top:50% }ul.rcentside li:nth-child(4){width:100%;left:0;top:75% }ul.rcentside .overlayx,ul.rcentside li{transition:all .4s ease-in-out }ul.rcentside .overlayx{width:100%;height:100%;position:absolute;z-index:2;left:0;top:0;opacity:.6;background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhINcSDpmdczVFVWdcMQEruOTGQdTGFSrxottNU5A4QgRb9vbcpVAs18WXnTXdrKPByjNA0nvvSDPxcQMUGXUBVdKhEPtC0ddggCg4hDN37A8TBkIoggTJdkGzUK2Zym8mF_6PRunNBTcA/s1600/linebg-fade.png);background-position:50% 50%;background-repeat:repeat-x }ul.rcentside .overlayx,ul.rcentside img{margin:3px}ul.rcentside li:nth-child(1).overlayx{background-position:50% 25% }ul.rcentside .overlayx:hover{opacity:.1 }ul.rcentside h4{position:absolute;bottom:10px;left:10px;right:10px;z-index:2;color:#fff;font-weight:700;margin:0;padding:10px;line-height:1.5em;font-weight:normal;overflow:hidden;transition:all .3s}ul.rcentside li:hover h4{bottom:30px}ul.rcentside li:nth-child(1)h4,ul.rcentside li:nth-child(4)h4{font-size:150% }ul.rcentside .label_text{position:absolute;bottom:0;left:20px;z-index:2;color:#fff;font-size:90%;opacity:0;transition:all .3s}ul.rcentside li:hover .label_text{bottom:20px;opacity:1}ul.rcentside li:nth-child(2).autname,ul.rcentside li:nth-child(3).autname{display:none }.buttons{margin:5px 0 0 }.buttons a{display:inline-block;text-indent:-9999px;width:15px;height:25px;position:relative }.buttons a::before{content:"";width:0;height:0;border-width:8px 7px;border-style:solid;border-color:transparent #535353 transparent transparent;position:absolute;top:50%;margin-top:-8px;margin-left:-10px;left:50% }.buttons a.nextx::before{border-color:transparent transparent transparent #535353;margin-left:-3px }
</style>
<div id="featuredpostside"></div>
<script type='text/javascript'>
function FeaturedPostSide(a){(function(e){var h={blogURL:"",MaxPost:4,idcontaint:"",ImageSize:100,interval:5000,autoplay:false,loadingClass:"loadingxx",pBlank:"http://1.bp.blogspot.com/-htG7vy9vIAA/Tp0KrMUdoWI/AAAAAAAABAU/e7XkFtErqsU/s1600/grey.gif",MonthNames:["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"],tagName:false};h=e.extend({},h,a);var g=e(h.idcontaint);var d=h.MaxPost*200;g.html('<div class="sliderx"><ul class="rcentside"></ul></div><div class="buttons"><a href="#" class="prevx">prev</a><a href="#" class="nextx">next</a></div>');var f=function(w){var q,k,m,u,x,p,t,v,r,l="",s=w.feed.entry;for(var o=0;o<s.length;o++){for(var n=0;n<s[o].link.length;n++){if(s[o].link[n].rel=="alternate"){q=s[o].link[n].href;break}}if("media$thumbnail" in s[o]){u=s[o].media$thumbnail.url.replace(/\/s[0-9]+\-c/g,"/s"+h.ImageSize+"-c")}else{u=h.pBlank.replace(/\/s[0-9]+(\-c|\/)/,"/s"+h.ImageSize+"$1")}k=s[o].title.$t;r=s[o].published.$t.substring(0,10);m=s[o].author[0].name.$t;x=r.substring(0,4);p=r.substring(5,7);t=r.substring(8,10);v=h.MonthNames[parseInt(p,10)-1];l+='<li><a target="_blank" href="'+q+'"><div class="overlayx"></div><img class="random" src="'+u+'"/><h4>'+k+'</h4></a><div class="label_text"><span class="date"><span class="dd">'+t+'</span> <span class="dm">'+v+'</span> <span class="dy">'+x+'</span></span> <span class="autname">'+m+"</span></div></li>"}e("ul",g).append(l).addClass(h.loadingClass)};var c=function(){e(h.idcontaint+" .nextx").click()};var b=function(){e.get((h.blogURL===""?window.location.protocol+"//"+window.location.host:h.blogURL)+"/feeds/posts/summary"+(h.tagName===false?"":"/-/"+h.tagName)+"?max-results="+h.MaxPost+"&orderby=published&alt=json-in-script",f,"jsonp");setTimeout(function(){e(h.idcontaint+" .prevx").click(function(){e(h.idcontaint+" .sliderx li:first").before(e(h.idcontaint+" .sliderx li:last"));return false});e(h.idcontaint+" .nextx").click(function(){e(h.idcontaint+" .sliderx li:last").after(e(h.idcontaint+" .sliderx li:first"));return false});if(h.autoplay){var i=h.interval;var j=setInterval(c,i);e(h.idcontaint+" .sliderx li:first").before(e(h.idcontaint+" .sliderx li:last"));e(h.idcontaint+" .sliderx").hover(function(){clearInterval(j)},function(){j=setInterval(c,i)})}e("ul",g).removeClass(h.loadingClass)},d)};e(document).ready(b)})(jQuery)};
//<![CDATA[
FeaturedPostSide({
  blogURL: "https://mybacklink86.blogspot.com",
  MaxPost: 8,
  idcontaint: "#featuredpostside",
  ImageSize: 300,
  interval: 5000,
  autoplay: true,
  tagName: false
});
//]]>
</script>

2. Save the widget and see the results.

Settings widget


blogurl: "https://mybacklink86.blogspot.com: Replace http://url_of_your_blog.blogspot.com with the url of your blog
MaxPost: 8 : The number of posts to be displayed
imagesize : The size or dimensions of the image in units of pixels
interval : The time needed when post slider switch
autoplay: true : To turn off auto slider, change the autoplay: true with autoplay: false
tagname: false : To add a new article based on the label, replace false with the name of a particular label. Eg Blogger: tagname: "Blogger"

Thus tutorial How to Install Widget Recent Post Responisve Slider in Sidebar Blog, may be useful.
LEARN MORE

How to Make a Simple Responsive Recent Posts in Blogspot


MyBacklink86 - Simple blog that will attract visitors much more than look too crowded. Crowded could have in terms of coloring is too much use of different colors or excessive use of widgets.

In addition to reducing the loading speed of a blog, use excessive widget also unsightly. By him that, this time My Backlink will give a tutorial use a simple widget recent posts.

Although simple, but it is quite spectacular recent posts because it can adapt to the theme of the blog.


READ ALSO:
How to Install Widget Recent Post Responsive Slider in Sidebar Blog

How to Make Recent Post Thumbnail Grid Display Responsive


How to make it simple, just follow the steps below.

1. First please copy and paste the following script into your sidebar blogspot. Figures 5 red marked simply replaced in accordance with the number of posts you want to display.

<script>
//<![CDATA[
function showlatestposts(json){document.write('<ul id="recent-posts">');for(var i=0;i<5;i++){var 
entry=json.feed.entry[i];var posttitle=entry.title.$t;var postsurl;if(i==json.feed.entry.length)break;for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='alternate'){postsurl=entry.link[k].href;break;}}
document.write('<li class="recent-posts">');document.write('<a href="'+ postsurl+'" target ="_top" title="'+ posttitle+'">'+ posttitle+'</a>');document.write('</li>');}
document.write('</ul>');};

document.write("<scr" + "ipt type=\"text/javascript\" src=\"/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=showlatestposts\"></scr" + "ipt>");
//]]>
</script>


2. After that, go to the Edit your HTML and paste the following code just above the </head>.

<style type='text/css'>
#recent-posts{
    width:auto;
    padding:0 10px;
    margin:0 auto;
    border:1px solid #ddd;
}
#recent-posts ul,#recent-posts li {
    list-style:none;
}
#recent-posts a{
    text-decoration:none;
}
#recent-posts li{
    border-top:1px solid #ddd;
    padding:6px 0
}
#recent-posts li:first-child{
    border-top:none;
}
</style>


3. After clicking Save and view the results on your blog.

Good Luck
LEARN MORE

How to Make a Pop Under Ads Alone in Blog


MyBacklink86 - How To Make Ads Pop Under Your Own Blog? It is very easy, there is not even one minute, then the ad can be directly installed on your favorite blog. But the problem is not easy or not, but rather whether the existence of these ads are favored by visitors or not? Well, it is important to note when you have no intention to advertise this model in your blog.

As we all know that pop under ads are ads that appear in a new window on the browser, which is where these ads appear automatically, alias unwanted visitors. These ads usually appear when there is an interaction of visitors, ie clicking on links contained in our blog.

Here MY BACKLINK share how, please look carefully ya:

1. Log in to Blogger.
2. Select Layout >> Add Gadget >> HTML / JavaScript.
3. Paste the code below into >> HTML / JavaScript.


<script  type="text/javascript">  function addEvent(obj, eventName, func){       if (obj.attachEvent)      {      obj.attachEvent("on" + eventName,  func);      }      else if(obj.addEventListener)      {       obj.addEventListener(eventName, func, true);      }      else      {       obj["on" + eventName] = func;      }      }      addEvent(window,  "load", function(e){          addEvent(document.body, "click",  function(e)          {             if(document.cookie.indexOf("bkc=lyk")  == -1)             {          params = 'width=' + screen.width;           params += ', height=' + screen.height;                  params += ',  top=1000, left=1200px ,scrollbars=yes';                  params += ',  fullscreen=yes,width=1000,height=800';                  var w = window.open("http://mybacklink86.blogspot.com", 'window', params).blur();                   document.cookie = "bkc=lykshoptinhoc";                  window.focus();              }          });      });  </script>

Note:
Please change the URL of the red with url address of the blog you want.

Pop under ads will only appear twice, namely when we visit our blog, and then we clicked on a link on our blog. Click the link to the third and so on, pop under ads will no longer appear.
LEARN MORE

How To Easily Install SEO Smart Links in Blog

SEO Smart Links in Blog
My Backlink - In this article my backlink will be sharing plugin SEO Smart Links & which is a WordPress plugin that works to change every word specified in an article be a link.

How to Work Smart SEO Plugin Link This plugin will read every word pal specified in the article. For example if my friend added the word SEO or Blogger in the plugin, then every word will be automatically turned into a link if at all in your blog article contained the word.

How to Install SEO Smart Links

Open Blogger > Template > Then add the following code before the</body>

<script type='text/javascript'>
function smartLink(){
    this.keywdHref = new Object();
    this.add = function(keyword, href){
        if(keyword.substr(0,1) != &quot; &quot;){keyword = &quot; &quot; + keyword;}
        this.keywdHref[keyword] =  href;
    }
    this.createAnchor = function(){
        var objs = document.getElementsByTagName(&quot;div&quot;);
        for(var i=0; i&lt;objs.length; i++){
            var obj = objs[i];
            if(obj.className.indexOf(&quot;post-body&quot;)&gt;-1){
                var content = obj.innerHTML;
                for(var keyword in this.keywdHref){
                    var href = this.keywdHref[keyword];
                    var newstr = content.replace(keyword, &quot;&lt;a href=&#39;&quot;+href+&quot;&#39;&gt;&quot;+keyword+&quot;&lt;/a&gt;&quot;, &quot;gi&quot;);
                    obj.innerHTML = newstr;
                    content = newstr;
                }
            }
        }
    }
    this.startScript = function(){
        var onLoad = window.onload;
        window.onload = function(){
            if(onLoad){onLoad();}
            setTimeout(&quot;f.createAnchor()&quot;, 100);
        }
    }
}
</script>
<script type='text/javascript'>
var f = new smartLink();
f.add(&quot;SEO&quot;, &quot;https://mybacklinks86.blogspot.com/&quot;);
f.startScript();
</script>


If you want the plugin above only appear on post pages only, please add a special conditional tags post page.

Save template

In the code that is marked with SEO by keywords pal specify and change https://mybacklinks86.blogspot.com/ with the url of your blog.


In the above code buddy can add more keywords below, as an example

f.add(&quot;SEO&quot;, &quot;https://mybacklinks86.blogspot.com/&quot;); f.add(&quot;Template&quot;, &quot;https://mybacklinks86.blogspot.com/&quot;); f.add(&quot;Blogger&quot;, &quot;https://mybacklinks86.blogspot.com/&quot;);

Buddy can also add words into bold, for example.

f.add(&quot;&lt;b&gt;SEO&lt;/b&gt;&quot;, &quot;https://mybacklinks86.blogspot.com/&quot;);

Note

It is advisable to use three keywords is enough.
LEARN MORE

How to Make Your Own URL Shortener with JavaScript in Blogger

How to Make Your Own URL Shortener with JavaScript

MyBacklink86 - How to Make Your Own URL Shortener with My Backlink, JavaScript - In this post I tried to create its own URL shortener using JavaScript code. If before me and you used to use bit.ly, goo.gl and the like, now I am and you will create its own URL shortener. The script that I can share is also called a URL Redirect. URL Redirection or transfer permalink actually been facilitated by a blogger, only limited on our blog, can not lead to other blogs.

If the existing CMS WordPress plugin "Simple URLs", the result will be something like with it, because I was also inspired by this plugin. If my friend do not know, maybe my friend never seen such links http://mybacklink86.blogspot.com/go/fb more or less like the picture. To be more clear, please click the Facebook My Backlink 86 below:

 https://your-link.blogspot.com/go/fb

To make it, save the code above </head> .

Example One

<script language='javascript'>
//<![CDATA[
var key = window.location.href.split("go/")[1].replace("/","")
var urls={
'fb':'https://www.facebook.com/mybacklink86,
'gplus':"https://plus.google.com/+xxxxxx",
'twitter':"https://twitter.com/xxxxxxx",
'blabla':"http://xxxxx.com/",
'blabla':"http://blabla.net",
'blabla':"http://www.blabla.com",
'blabla':"https://www.blabla.us" /* the latter without coma */
}
if(key){
if(urls[key]){
window.location.href=urls[key]
}else{
document.write("'"+key+"' not found :(");
}
}
//]]>
</script>

Example Two

<script language='javascript'>
//<![CDATA[
var key = window.location.href.split("go/")[1].replace("/","")
var urls={
'fb':'https://www.facebook.com/mybacklink86,
'gplus':"https://plus.google.com/+xxxxxx",
'twitter':"https://twitter.com/xxxxxxx",
'blabla':"http://www.blabla.com",
'blabla':"https://www.blabla.us" /* the latter without coma */
}
if(key){
if(urls[key]){
window.location.href=urls[key]
}else{
document.write("'"+key+"' not found :(");
}
}
//]]>
</script>

Example Three

<script language='javascript'>
//<![CDATA[
var key = window.location.href.split("go/")[1].replace("/","")
var urls={
'fb':'https://www.facebook.com/mybacklink86,
'gplus':"https://plus.google.com/+xxxxxx",
'twitter':"https://twitter.com/xxxxxxx" /* the latter without coma */
}
if(key){
if(urls[key]){
window.location.href=urls[key]
}else{ document.write("'"+key+"' not found :(");
}
}
//]]>
</script>

Change / add the link as desired mate. To understand it, when I wrote 'fb':'https://www.facebook.com/mybacklink86' means, when accessing http://your-link.blogspot.com/go/fb will lead to https://www.facebook.com/mybacklink86.
LEARN MORE

How to Make the Anti Copy Paste Except certain parts of Blogger

don't not copy paste

Live Demo Here

MY BACKLINK - How to Make the Anti Copy Paste Except certain parts of Blogger. Have your Blog Copas by others? if ever what you feel? surely you would be annoyed and angry, we are tired - tired of writing by hand until kinky, eh not him someone else is reading your blog copy and paste the link source without.

One way to minimize the blog post so as not to copy and paste is to install script or css anti Copas blog you, but this is not suitable for you, if your blog about the tutorial, because the blog tutorial there are some code like css, html, javacript and others - others who must be able to copy and paste someone else. Oh yes anti copy and paste this script does not use javascript but using css, so it does not affect the loading of your blog.

How to Make the Anti Copy Paste Except certain parts of Blogger.

  1. Log in to blogger account.
  2. Log into the template editor (Edit HTML).
  3. Then put the anti Copas css code below the above code ]]></b:skin>.

  4. 
    .post-outer {
    -webkit-touch-callout:none;
    -webkit-user-select:none;
    -khtml-user-select:none;
    -ms-user-select:none;
    -moz-user-select:none;
    }
    


  • Then so that later we can make certain parts can copy and paste, then we have to add the code below in the section & blockquote, pre and code.
  • The trick pairs css below the above code ]]></b:skin>.

    
    .post blockquote,.post pre,.post code{
      -webkit-touch-callout:text;
      -webkit-user-select:text;
      -khtml-user-select:text;
      -ms-user-select:text;
      -moz-user-select:text;
    }
    


  • The last step Save the template and see the results.

  • Now you can make your blog is safe from the copaser. If certain parts of your blog can copy and paste, then you've succeeded in implementing trick Easy Ways to Make Blog Not Be in Copas Unless Specified Part.

    Hope it is useful
    LEARN MORE

    How To Make Youtube Videos Autoplay in blog

    youtube autoplay on blog

    MY BACKLINK - Hello guys, in the following trick is a youtube video to be installed or included on our blog, and the video will automatically rotate automatically (autoplay) when we opened the pages of our blog visitors. Video sample below my take on youtube. I chose the video track "I'm With You - Avril Lavigne | Cover by Keesamus" as an example tutorial, because I like the song and Keesamus.

    Live Demo Here


    How To Make Youtube Videos Autoplay in blog.

    Okay, now we begin to discuss the tutorial.

    Here's how:


    1.First you must take the first on youtube embed code.

    2. Open the YouTube video you want to put on the blog. Video should you play or you turn off. Up to you.

    3. Note the below video. Please click Share or Share, and then click Pin or Embed. See the picture below.

    Youtube Videos Autoplay


    4. After that please copy the embed code that appears there. See picture on the blue background.

    5. Paste embed code / embedded this code in notepad. Then add the code: ?rel=0&amp;autoplay=1

    The results will be as follows:

    
    <iframe width="500" height="350" src="https://www.youtube.com/embed/5fUpc8tGNy4?rel=0&amp;autoplay=1" frameborder="0" allowfullscreen></iframe>
    

    Note:
    500 is high and the 350 is the width of the video. Please adjust the height and width of her YouTube videos. <
    LEARN MORE

    How to Make Text Walking in Blog

    How to Make Text Walking in Blog

    How to Make Text Walking in Blog - Ever not you see the writing / text - paced sector in the blog? I think you must have seen it, the kind of writing such a marquee name, the actual function merely as decoration on the blog alone, almost the same as headline news, only that it is easier ngaturnya, especially in regulating the movement / behavior in the desired text. You are interested in making the running in the blog posts, please consider the following ways.

    1. Login to blogger.
    2. Click Layout >> Add a Gadget >> HTML/JavaScript(If you want to display on your blog widget).
    3. Click save and see the results.

    How to Make Walking in Blog Posts


    1. The text moves from right to left

    <marquee direction="left" scrollamount="2" align="center">MY BACKLINK 86</marquee>

    The result

    MY BACKLINK 86


    2. The text moves from left to right

    <marquee direction="right" scrollamount="2" align="center">MY BACKLINK 86</marquee>

    The result

    MY BACKLINK 86


    3. The text moves back and forth from left to right

    <marquee direction="left" scrollamount="2" align="center" behavior="alternate">MY BACKLINK 86</marquee>

    The result

    MY BACKLINK 86


    4. The text moves back and forth from right to left

    <marquee direction="right" scrollamount="2" align="center" behavior="alternate">MY BACKLINK 86</marquee>

    The result

    MY BACKLINK 86


    5. The text moves from top to bottom

    <marquee direction="down" scrollamount="2" align="center">MY BACKLINK 86</marquee>

    The result

    MY BACKLINK 86


    6. The text moves from bottom to top

    <marquee direction="up" scrollamount="2" align="center">MY BACKLINK 86</marquee>

    The result

    MY BACKLINK 86


    7. The text moves back and forth from top to bottom

    <marquee direction="up" scrollamount="2" align="center" behavior="alternate">MY BACKLINK 86</marquee>

    The result

    MY BACKLINK 86


    8. Text moving zig - zag (diagonal) bounces

    <center><marquee direction="up" scrollamount="2" align="center" behavior="alternate" width="90%"><marquee direction="right" behavior="alternate"> MY BACKLINK 86</marquee></marquee></center>

    The result

    MY BACKLINK 86


    9. Text moving zig - zag (diagonal) translucent

    <center><marquee direction="up" scrollamount="2" align="center" behavior="alternate" width="90%"><marquee direction="right">MY BACKLINK 86</marquee></marquee></center>

    The result

    MY BACKLINK 86


    Note:
    • Direction: to regulate the movement patterns of text (left, right, up and down).
    • Scrollamount: to regulate the speed of movement of the text. Raise the numbers (from 2 to 3) to accelerate the movement and vice versa.
    • Behavior (scroll / slide / alternate): to set the movement behavior.
    LEARN MORE