THEBOEGIS: Blogger Tutorial

Free Software & Template Full Tutorial.

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

Monday, February 17, 2020

Cara Membuat Mockup Responsive Template dengan Background Warna

Cara Membuat Mockup Responsive Template dengan Background Warna

Hallo sabat Blogger!!!  kali ini saya akan membagikan Tutorial blogger, Cara Membuat Mockup Responsive Template dengan Bacground Warna, Artikel Tutorial ini saya buat dari deskan temen blogger yang belum mengetahui Cara Membuat Mockup Responsive Template dengan Bacground Warna  . Pada kesempatan ini di waktu yang sempit ini saya coba membuat tutorial tersebut

Ok get on with it
Pertama yang harus dilakukan adalah memilih tema mana yang akan kita buatkan Mockup - nya

Kedua silahkan sobat kunjungi Alamat web ini ( Klik Disini ) jika error. Ada dapat copy langsung link ini : (ketergan.  Ganti link dengan link blog / web yg mau dibautkan mockup, setelah itu tekan enter)
Setelah sobat masuk di web penyedia Mockup tersebut,  silahkan sobat lakukan memasukan alamat url blog / web yg ingin di buatkan Mockup dengan mengunakan https://.
Untuk lebih jelas nya perhatikan gambar di bawah ini :

Wednesday, January 15, 2020

Here's How to Install the CSS Minifier Tool on Blogger Static Pages

CSS Minify / Minifer is a tool or tool that has a function to clean up CSS code sets or Cascading Style Sheets. In addition, this tool can also compress CSS scripts to be smaller and lighter when used.

Better, this tool is used by Bloggers to load their blogs lighter.

Speaking of CSS Minify Tools, on this occasion the author will give a brief tutorial on How to Easily Create Responsive Minifer CSS Pages on Blogger. If you are interested in being invited, you can see in the following tutorial.

Here's How to Create a Responsive Color Picker Page on Blogger

Color Picker in English which means 'color picker'. As the name implies, Color Picker is a tool or tool that has a function to choose colors and will be displayed in detail. Like the color of HEX and RGB. This tool is usually often encountered in some photo editing software and applications.

In addition, this tool is also often used by graphic designers and blog template designers who are nothing but choosing unique and beautiful colors.

Talking about the Color Picker Tool, in this article the author will give a short tutorial on How to Create a Responsive Color Picker Page on Blogger. If you are interested in making it, you can look at the following tutorial.

Friday, December 13, 2019

How To Install Recent Comment Disqus + Back To Top

How To Install Recent Comment Disqus + Back To Top. surely you already know with this style that many have used. and especially the template users commenting on disqus ... one of them is the famous blog Arlina Design uses Recent Comment Disqus + Back To Top

Step 1
First As usual Login to Blogger> click Themes> Click Edit Theme. after you enter the editing template Search</head> or &lt;/head&gt;&lt;!--<head/>--&gt;for faster Press Ctrl + F on your computer keyboard
After meeting Place the Code below right above the Code</head> or &lt;/head&gt;&lt;!--<head/>--&gt;

Monday, December 2, 2019

How to Change the Look of the First Image to Beautiful or Make a First Image

Hi all !! I am crazy about making articles, even though I have discussed many articles, and copying articles this time. I am currently posting gas2 .
Okey, this time I will discuss Tutorial:  How to Change the First Image to Be Beautiful or Make First Image , this tutorial has been discussed with one of Bogger's masters, Ms  Rhinokage Rio admin from , I re-discussed because there were many requests from 2 Blogger friends to make the First Image Tutorial, even though it was clearly discussed at

First Image There are 2 versions of the first version of the Invert Pro Template  made by and the second is First Image from
- Ok ... straight on its making

How to Send a Link or Send Indexing Requests

How to Submit Indexing Requests in the Latest Google Search Console - it's possible for par masters to be stale with this tutorial, but what can you do instead of not creating articles !!!

Ok, just not long, direct length

1. Open your Blogger Account, Click on Settings >  Search Preferences > then click edit on  Google Search Console , to clarify the image below

Saturday, November 9, 2019

How to make floating ad slots on Blogger

How to make floating ad slots on Blogger
Hello Blogger friend! This time my blog will give tips on How to Make Floating Ad Slots on Blogger. The reason to place floating ad slots on a blog is to maximize our revenue, especially for blogs that have added AdSense ads.

Tips for Watching Youtube Videos

Tips for Watching Youtube Videos
Tips for Watching Youtube Videos
Tips to Watch Youtube Videos Widely - Needs tips, ways and efforts so that the videos we upload on YouTube have a large audience. Page view or the number of views on YouTube is very important role, especially for a number of companies that promote their products via YouTube, so that they can get the trust of many people to market their products.

This also applies to Youtubers who use YouTube to make money through Google Adsense. If the video is viewed a lot means the chance to get dollars will be even greater.

The natural way is to bring visitors or viewers naturally on YouTube videos, namely counter view / number of views coming from humans, not bots or scams. Because this method violates YouTube's new policy, visitors who come from robots will not be included in the count list.
Tips for Watching Youtube Videos
Tips for Watching Youtube Videos
So it would be useless if you use this method, because the Youtube system is now more selective in calculating the number of video views.

You should first read the Youtube video optimization article that I have explained before, there are important points on how to maximize youtube videos, so that they can be easily found in searches and seen by many people.

1. Make a video niche according to the category with channel / new channel

If you have many videos, it's best to group them in one channel or one channel only. The goal is that your video is not mixed together, and can become one category. Viewers will also find it easier to find other videos of the same type in 1 channel.

Without you realizing this will also increase the number of other video views. Make Chanel or the new channel SEO friendly, so videos can be easily found in search engines.

2. Make quality original videos

Make videos that are unique and original, according to their respective categories with clear video quality (HD), if you really need to do video editing with video editing software that you are good at. With good quality video, it is expected to be able to spoil the eyes of the audience, and be able to compete with other videos.
Tips for Watching Youtube Videos
Currently Youtube can play videos with a resolution of 8K (7680 × 4320). But we can use just the standard video, with a resolution of 1080p, 720p & 480p.

3. Make a video that is trending now

The types of videos that are booming or trending topics are usually sought after by the audience. This can be related to the latest news at the moment, or what is being said and talked about by many people. By following this development, people will find your channel and videos through a search engine, which is looking for new video sources.

4. Make an interesting title in accordance with the category and do not cheat

Now viewers are smart, and don't want to be fooled by titles that don't match the content in the video, make sure to maintain the quality and reputation of the channel by making titles that are interesting and in accordance with the category, once you cheat you will lose your chance to get subscribers.

5. Increase and increase the number of video collections.

By having lots of videos, a viewer will be more curious to see your other videos, because in one video channel on YouTube there is already a facility that automatically arranges your collection videos neatly, by having lots of videos you will most likely get lots of subscribers. Another case if you only have 3-4 videos.

6. Promote your video.

After finished uploading the video, don't forget to promote your video ... this method can be through social media or the web / blog if you happen to have. If you have a lot of customers / Subscribers will be very helpful, because once you finish uploading the video there will be a notification via email. And this really helps you to get more viewers.

About increasing customers or subscribers

If you follow the tips and suggestions above, God willing, customers or Subscribers will come by themselves. Currently there are lots of tutorials and ways to bring in or get YouTube customers, but there have never been any results.

Logically, if your video and channel are good and interesting then subscribers / subscribers will be willing to direct the mouse to the Subscribe button on your channel.

Secrets of How to Register for Google AdSense To Be Easily Accepted

Secrets of How to Register for Google AdSense To Be Easily Accepted
Secrets of How to Register for Google AdSense To Be Easily Accepted
Maybe you will ask why adsense is not as promising as we thought? The answers are many, but certainly all that require sacrifice is not small, optimization will not be able to guarantee success with Google Adsense .

I quoted a lot from all adsense publishers in order to be successful, including not only silent but applauding but through a little struggle, if you can earn a decent income with adsense manually, congratulations, you will not go back, but if you have not succeeded, your chances are can have to think and rack your brain so that each of your actions can be successful.

Terms in Google Adsense

Terms in Google Adsense
Terms in Google Adsense
Terms in Google Adsense - We know Google Adsense is an advertising medium that is quite promising at this time. Many bloggers often get hundreds to thousands of dollars in just a month.

However, of course that much income is not obtained by simply turning the palm of the hand. There are so many processes that have to be done to produce such results. As if the business is directly proportional to the results of the income obtained.

Friday, November 8, 2019

Tutorial on Making Direct Links Download Google Drive

Tutorial on Making Direct Links Download Google Drive
Tutorial on Making Direct Links Download Google Drive
3 Ways to Make Google Drive Direct Download Links [Google Drive Automatic Download]

Good evening this time I will share about how to do a Tutorial or Direct Link Download Google Drive Tutorial. until now Google Drive is still a favorite service for uploading and downloading process because it's very good service.
Google Drive is not only used for storage, but can also be downloaded publicly when we share. It's just that the URL provided by Google is not a direct download link. To make it easier for users who want to download the files that you have shared, you need a permanent direct link, so that with a single click on the link, the file or document can be downloaded immediately. Here's how to create a download link directly from Google Drive, here are three ways to make it:

Method 1: Change the Google Drive link ID code

Make sure the file to be shared has been set to "Share Public". In order to obtain the share link (share link).

Example of a share link: 1wUVb_ahWfJ7WDCPUFugUMxnJLrQGRtP3 / edit? usp = sharing

The red color is the ID for the file in Google Drive. To get the Direct Link, then replace the link above with the format as below: ID of your file

So the link will be: 1wUVb_ahWfJ7WDCPUFugUMxnJLrQGRtP3

The link above is a direct link that you can place on your blog website

Method 2: Using a Website URL Generator

Sunday, November 3, 2019

Advantages and disadvantages of the latest Blogger responsive display

Recently, blogger has launched a new look responsive that allows bloggers to be accent on mobile quickly, and easy to use but the drawbacks are still many

advantages of this new look for bloggers who use mobile phones can easily do editing Theme / Template on Html edit.
Medium display is very difficult to open edit html. With this new look Editing or adding scripts, CSS etc can be done well and easily on mobile phones.

Wednesday, March 6, 2019

Cara mengganti Template atau tampilan Blogger dengan cepat

Langsung aja gk usa ulur2 cerita kaya apa aja

Pertama Login ke akun blogger anda mengunakan Gmail
Setelah masuk langsung Klik /buka Tulisan Tema
Seperti Gambar dibawah :

Cara Cepat Membuat Blog Dalam Hitungan Menit

Langsung aja kagak usa banyak lika liku cerita ahirnya orang gk paham .. ok ini dia cara daftar dan membuat blog dalam hitugan menit
yang perlu di sipakan  :
Jarigan internet
Kopi Susu kalu perlu kopinya di gela susunya pegang aja !!
Akun google
daftar dan buat Blogger
login ke akun google / atau langsung masuk jika sudah logi di gmail
Setalah buka akan penampkan seperti di gambar di bawah ini :

Membuat Gambar Utama Postingan Dengan Info dan Share Post

Untuk mengikuti tutorial ini, pastikan gambar utama pada blog sobat asli upload melalui blogger, dan gambar utama tidak boleh di dalam table maupun caption, jika gambar utama pada postingan sobat hasil copy paste atau di dalam table maka gambar utama yang asli tidak akan hilang dan hasilnya gambar menjadi double.
 Ikuti tutorial di bawah ini untuk memasang gambar utama postingan yang menarik.

Masuk ke Blogger > Tema > Edit HTML

Letakan CSS berikut ini tepat di atas kode ]]></b:skin> atau </style>
/* CSS First Image, Post Info and Share */
#first-blanter{background:#fff;box-shadow:0 2px 13px rgba(0,0,0,.1);border-radius:10px;overflow:hidden;position:relative;padding-bottom:60px;margin-bottom:20px}
.card-author.vcard{position:absolute;bottom:-10px;left:40px;z-index:9;font-size:13px}{width:70px;height:70px;border-radius:100%;float:left;border:4px solid #fff;margin-right:15px}
.card-author a{line-height:9!important;font-weight:700;color:#222}
.card-time{position:absolute;top:15px;right:15px;background:#5d5d5d;color:#fff;line-height:1.8;font-size:13px;padding:5px 10px;margin-right:10px;margin-top:10px;border-radius:5px}
.card-time abbr{color:#fff;text-transform:none;font-style:none;text-decoration:none!important;border-bottom:0!important}
#card-share a{position:relative;float:left;border-radius:2.5px;display:block;padding:3.5px 14px 7.5px;margin:0 5px;width:20px;height:20px}
#card-share a:hover{-webkit-filter:opacity(85%)}
.shareyes-a{margin:-10px 0 12px;display:none}
.shareyes{display:none;position:relative;margin:0 0 -8px}
@media screen and (max-width:768px){
#card-share a{text-align:center}
@media screen and (max-width:680px){
#card-share a{width:14%;text-align:center}
@media screen and (max-width:480px){#card-share a{width:11.4%}}
@media screen and (max-width:380px){#card-share a{width:10%}}

letakan Javascript di bawah ini tepat di atas kode </body>
<script type='text/javascript'>
$(function(){$(".separator:first").remove(),$(".post-body > img:first").remove()});

Terakhir Letakan HTML di bawah ini, tepat di atas kode <data:post.body/> (kode tersebut ada lebih dari satu, pastikan coba satu-persatu dan test untuk mengetahui muncul atau tidaknya)
Biasa Nya terletak di  atas tombol Share This 
<div id='first-blanter'>
<img class='first-image' expr:alt='data:post.title' expr:src='resizeImage(data:post.thumbnailUrl,600)' expr:title='data:post.title'/>
<div class='card-author vcard'>
<b:if cond='data:top.showAuthor'>
<b:if cond='data:post.authorProfileUrl'>
<div class='fn' itemprop='author' itemscope='itemscope' itemtype=''>
<img class='photo-wrap' expr:src='resizeImage(data:post.authorPhoto.url,100)' itemprop='image'/>
Posted by <a expr:href='data:post.authorProfileUrl' itemprop='url' rel='author' title='author profile'>
  <span itemprop='name'><></span></a>
  </div><b:else/><span class='fn' itemprop='name'><></span></b:if></b:if></div>
<div class='card-time'>
<abbr class='published updated timeago' expr:title='data:post.timestampISO8601' itemprop='datePublished dateModified'><data:post.dateHeader/></abbr>
<div id='card-share'>
<a class='fb' expr:href='&quot;; + data:blog.url' target='_blank' rel='nofollow' title='Share to Facebook'><svg class='icons icon-facebook-d' viewBox='0 0 24 24'><path d='M9 8h-3v4h3v12h5v-12h3.642l.358-4h-4v-1.667c0-.955.192-1.333 1.115-1.333h2.885v-5h-3.808c-3.596 0-5.192 1.583-5.192 4.615v3.385z' fill='#fff'/></svg></a>
<a class='tw' expr:href='&quot;; + data:post.url' target='_blank' rel='nofollow' title='Share to Twitter'><svg class='icons icon-twitter-d' viewBox='0 0 24 24'><path d='M24 4.557c-.883.392-1.832.656-2.828.775 1.017-.609 1.798-1.574 2.165-2.724-.951.564-2.005.974-3.127 1.195-.897-.957-2.178-1.555-3.594-1.555-3.179 0-5.515 2.966-4.797 6.045-4.091-.205-7.719-2.165-10.148-5.144-1.29 2.213-.669 5.108 1.523 6.574-.806-.026-1.566-.247-2.229-.616-.054 2.281 1.581 4.415 3.949 4.89-.693.188-1.452.232- 1.956 2.444 3.379 4.6 3.419-2.07 1.623-4.678 2.348-7.29 2.04 2.179 1.397 4.768 2.212 7.548 2.212 9.142 0 14.307-7.721 13.995-14.646.962-.695 1.797-1.562 2.457-2.549z' fill='#fff'/></svg></a>
<a class='pt' expr:href='&quot;; + data:post.url + &quot;&amp;amp;media=&quot; + data:post.thumbnailUrl + &quot;&amp;amp;description= + data:post.title&quot;' target='_blank' title='Share to Pinterest'><svg class='icons icon-pin-d' viewBox='0 0 24 24'><path d='M13.25,17.25C12.25,17.25 11.29,16.82 10.6,16.1L9.41,20.1L9.33,20.36L9.29,20.34C9.04,20.75 8.61,21 8.12,21C7.37,21 6.75,20.38 6.75,19.62C6.75,19.56 6.76,19.5 6.77,19.44L6.75,19.43L6.81,19.21L9.12,12.26C9.12,12.26 8.87,11.5 8.87,10.42C8.87,8.27 10.03,7.62 10.95,7.62C11.88,7.62 12.73,7.95 12.73,9.26C12.73,10.94 11.61,11.8 11.61,13C11.61,13.94 12.37,14.69 13.29,14.69C16.21,14.69 17.25,12.5 17.25,10.44C17.25,7.71 14.89,5.5 12,5.5C9.1,5.5 6.75,7.71 6.75,10.44C6.75,11.28 7,12.12 7.43,12.85C7.54,13.05 7.6,13.27 7.6,13.5A1.25,1.25 0 0,1 6.35,14.75C5.91,14.75 5.5,14.5 5.27,14.13C4.6,13 4.25,11.73 4.25,10.44C4.25,6.33 7.73,3 12,3C16.27,3 19.75,6.33 19.75,10.44C19.75,13.72 17.71,17.25 13.25,17.25Z' fill='#fff'/></svg></a><a class='em' expr:href='&quot;; + data:blog.blogId + &quot;&amp;postID=&quot; + + &quot;&amp;target=email&quot;' onclick=',&quot;popupwindow&quot;,&quot;status=0,height=500,width=500,resizable=0,top=50,left=100&quot;);return false;' rel='nofollow' target='_blank' title='Share to Email'><svg class='icons icon-em-d' viewBox='0 0 24 24'><path d='M12,13L2,6.76V6C2,4.89 2.89,4 4,4H20A2,2 0 0,1 22,6V6.75L12,13M22,18A2,2 0 0,1 20,20H4C2.89,20 2,19.1 2,18V9.11L4,10.36V18H20V10.36L22,9.11V18Z' fill='#fff'/></svg></a>
<a class='wa' data-action='share/whatsapp/share' expr:href='&quot;; + data:post.title + &quot; &quot; + data:post.url' title='Share to Whatsapp' target='_blank'><svg class='icons icon-wa-d' viewBox='0 0 24 24'><path d='M.057 24l1.687-6.163c-1.041-1.804-1.588-3.849-1.587-5.946.003-6.556 5.338-11.891 11.893-11.891 3.181.001 6.167 1.24 8.413 3.488 2.245 2.248 3.481 5.236 3.48 8.414-.003 6.557-5.338 11.892-11.893 11.892-1.99-.001-3.951-.5-5.688-1.448l-6.305 1.654zm6.597-3.807c1.676.995 3.276 1.591 5.392 1.592 5.448 0 9.886-4.434 9.889-9.885.002-5.462-4.415-9.89-9.881-9.892-5.452 0-9.887 4.434-9.889 9.884-.001 2.225.651 3.891 1.746 5.634l-.999 3.648 3.742-.981zm11.387-5.464c-.074-.124-.272-.198-.57-.347-.297-.149-1.758-.868-2.031-.967-.272-.099-.47-.149-.669.149-.198.297-.768.967-.941 1.165-.173.198-.347.223-.644.074-.297-.149-1.255-.462-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.297-.347.446-.521.151-.172.2-.296.3-.495.099-.198.05-.372-.025-.521-.075-.148-.669-1.611-.916-2.206-.242-.579-.487-.501-.669-.51l-.57-.01c-.198 0-.52.074-.792.372s-1.04 1.016-1.04 2.479 1.065 2.876 1.213 3.074c.149.198 2.095 3.2 5.076 4.487.709.306 1.263.489 1.694.626.712.226 1.36.194 1.872.118.571-.085 1.758-.719 2.006-1.413.248-.695.248-1.29.173-1.414z' fill='#fff'/></svg></a>

Simpan Template.
BY :

Update Date Template 2019

Tutorial ini Buat anda pengguna Adsense dan Template Saflink 

Sekarang ini Adsense susah muncul jika url memiliki tanda ? atau # dan kode lainnya seperti pada safelink seperti ?url=gfdsghkuy567432fghhh karena itu dianggap sebagai url baru yang harus menunggu index, kecuali url dengan ? atau # tersebut sudah banyak diakses pengunjung sehingga index sudah normal maka iklan akan muncul normal.

Untuk itu, di update safelink ini, kita menghilangkan kode ?url=........... pada url post enscripsi safelink sehingga url hanya akan tampil sebagai url asli tanpa embel2 agar iklan tetap muncul di url enscripsi.

Demo: Silahkan coba download di sini lalu perhatikan url di halaman safelink nya dan apakah iklan tampil?

untuk itu silahkan tambahkan script ini di atas </body>
var uri=window.location.toString();if(uri.indexOf("?","?")>0){var clean_uri=uri.substring(0,uri.indexOf("?"));window.history.replaceState({},document.title,clean_uri)}

Saturday, October 13, 2018

How to Make a Sitemap with the Timeline Style

This time Wiendhy Stres will discuss and explain how the ways or steps you can follow and do in How to Make a Sitemap with the Timeline Style .
The creation of a sitemap aims to simplify visitor navigation in tracing posts in a blog. In addition, the sitemap also allows search engine crawler robots to explore blogs. Blogs will be judged to be more structured if they have a special sitemap page.

How to Make a Sitemap with the Timeline Style

Okay, just go ahead and follow the steps below 

Open your Blogger page , click the Theme menu , click the Edit HTML button and add this code before </head>

<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<style type='text/css'>
.namina-sitemap{position:relative;margin:30px auto}
.namina-toc-wrap .namina-cat{background:#fff;border-radius:2px;color:#333;font-size:15px;font-weight:700;padding:10px 20px;border:4px solid #333;text-transform:capitalize}
.namina-toc{margin:0;padding:30px 20px;position:relative}
.namina-sitemap ul.namina-toc{margin:0;padding:30px 0;list-style-type:none}
.namina-toc li{list-style:none;margin:0;padding:0;position:relative}
.namina-toc &gt; li .toc-date{color:#999;display:block;font-size:14px;font-weight:bold;position:absolute;text-transform:uppercase;top:25px;width:15%}
.namina-toc &gt; li .namina-icon{background:#fff;border-radius:50%;box-shadow:0 0 0 4px #333;color:#fff;font-size:1.4em;font-style:normal;font-variant:normal;font-weight:normal;height:10px;left:22%;line-height:10px;margin:0 0 0 -25px;position:absolute;text-align:center;text-transform:none;top:30px;width:10px}
.namina-toc &gt; li .namina-post::after{border-color:transparent #f5f5f5 transparent transparent;border-style:solid;border-width:10px;content:&quot;&quot;;height:0;pointer-events:none;position:absolute;right:100%;top:auto;width:0}
.namina-toc &gt; li .namina-post{background:#f5f5f5;border-radius:5px;display:block;font-size:15px;margin:0 0 15px 23%;padding:25px 30px;position:relative}
.namina-toc &gt; li .namina-post a{color:#333;font-weight:700}
.namina-toc &gt; li:last-child .namina-post{margin:0 0 0 23%}
.namina-toc &gt; li .namina-post a:hover{color:#999}
<script type='text/javascript'>
$(document).ready(function(){var static_page_text=$.trim($(".post-body").text());var text_month=[,"Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sept","Oct","Nov","Dec"];if(static_page_text==="[sitemap]"){var postbody=$(".post-body");$.ajax({url:"/feeds/posts/default?alt=json-in-script",type:"get",dataType:"jsonp",success:function(e){var t=[];for(var n=0;n<e.feed.category.length;n++){t.push(e.feed.category[n].term)}var t=t.join("/");postbody.html('<div class="namina-sitemap"></div>');$(".post-body .namina-sitemap").text(t);var r=$(".namina-sitemap").text().split("/");var i="";for(get=0;get<r.length;++get){i+="<span>"+r[get]+"</span>"}$(".namina-sitemap").html(i);$(".namina-sitemap span").each(function(){var e=$(this);var t=$(this).text();$.ajax({url:"/feeds/posts/default/-/"+t+"?alt=json-in-script",type:"get",dataType:"jsonp",success:function(n){var r="";var i='<ul class="namina-toc">';for(var s=0;s<n.feed.entry.length;s++){for(var o=0;o<n.feed.entry[s].link.length;o++){if(n.feed.entry[s].link[o].rel=="alternate"){r=n.feed.entry[s].link[o].href;break}}var u=n.feed.entry[s].title.$t;var a=n.feed.entry[s].published.$t,f=a.substring(0,4),l=a.substring(5,7),c=a.substring(8,10),h='<span class="day">'+c.replace(/^0+/,"")+'</span><span class="month">'+text_month[parseInt(l,10)]+' </span><span class="year">'+f+"</span>";i+='<li><div class="toc-date">'+h+'</div><div class="namina-icon"></div><span class="namina-post"><a href="'+r+'">'+u+"</a></span></li>"}i+="</ul>";e.replaceWith('<div class="namina-toc-wrap"><div class="namina-cat">'+t+'</div>'+i+"</div>")}})})}})}});

When finished, click the Save theme button.

Then select the Page menu then click the new Page button

After that, click the HTML button then add the caller code below in HTML


Then click Publish and see the results

Now that's from Wiendhy Stres about how to make a sitemap with the timeline style . Sorry if there are deficiencies and hopefully useful for you.

Eliminating Blog Title on Google AdSense Matched Content

Eliminating Blog Title on Google AdSense Matched Content
As we know, Matched Content is one of the features of Google AdSense that serves to display a row of related posts based on the label in the post. The way it works is more or less the same as the Related Post widget in Blogger that you normally see in the templates that add it.

On the Google AdSense dashboard you can create Matched Content ad units and can also be modified in the settings. But there are obstacles when it appears on your blog that the blog title also appears in the row of links that are displayed and it will be a little annoying because the link is longer.

The following is an example of the display of the Google AdSense Matched Content ad unit of the Wiendhy Stres blog.

The benefits of this ad unit for your blog are:

  • Increase Pageview on blogs
  • Increase readers who faithfully read your blog content
  • Will have a good impact on increasing advertising revenue

Eliminating Blog Title on Google AdSense Matched Content

At this time the Blogger Tips Wiendhy Stres will provide a solution on how to Eliminate Blog Title on Google AdSense Matched Content . For those who experience this problem, let's look at the method below.

Login to Blogger > Click the Theme menu and click the Edit HTML button > Search and delete the meta tag below

<meta expr:content='data:blog.pageTitle' property='og:title'/>

Change with the code below

<meta expr:content='data:blog.pageName' property='og:title'/>

Click the Save theme and finish button . Then check the changes on your blog. Easy enough isn't it? If there are still no changes, it usually takes time to remove the blog title on Matched Content. To adjust the appearance of Matched Content, you can visit this link .

For those of you who want to have the Latest Hosting Promo Code , please visit the Promo Hosting

from Wiendhy Stres about How to Eliminate Blog Title on Google AdSense Matched Content , hopefully it will be useful for your friends and greetings.

Monday, September 17, 2018

How to delete CSS, Javascript, and Blogger Bundle Widgets

How to delete CSS, Javascript, and Blogger Bundle Widgets
The following tips are requests from bloggers via the contact form asking how to delete CSS, Javascript, and Blogger Bundle Widgets on the template? Actually this method has a lot of sharing, but there is nothing wrong if this time Arlina Design shares these tips.

Why do you have to delete CSS, Javascript, and Blogger Bundle Widgets?

Removing CSS, Javascript, and Blogger Bundle Widgets is one of the optimizations to speed up blog loading by hiding CSS, Javascript, and blogger default Bundle Widgets that will automatically load when the blog is opened. For example if we check the blog on Google PageSpeed ​​Insight , a warning will appear.
Of course, having a blog with fast loading will make visitors more comfortable and even easier for search engines to crawl your blog. Well, to overcome this problem we have to edit some HTML tags in the blog template so that the default CSS, Javascript, and Bundle Widget code is no longer automatically loaded on the blog.
Warning: By doing tips that I will share this, most of the default blogger widgets won't work properly, so backup the template before doing this optimization.
If it's ready, please follow the steps below.

How to delete CSS, Javascript, and Blogger Bundle Widgets

Open Blogger > Click the Theme menu > Click the Edit HTML button then find the opening code for the head below


Change with the code below


Next look for this code to hide CSS Reset


Change with the code below

&lt;style type=&quot;text/css&quot;&gt;
&lt;!-- /*<b:skin><![CDATA[*/]]></b:skin>
<style type='text/css'>

Search for this code


Change with the code below


Next to the head cover code, look for this code


Change with the code below


The next step is to cover the body code, find this code


Change with the code below


Is it still advanced? Okay, there are still two more. Now in the HTML opening and closing code, look for this 

code HTML opening code


Change with the code below

<HTML expr:dir='data:blog.languageDirection'>

HTML closing code


Change with the code below


Well, it's done! Then click the Save theme button (click refresh if a warning popup appears from the Blogger page). How, easy enough isn't it? Please check your blog on Google PageSpeed ​​Insight . If it has increased then the steps above are successfully applied to your blog. 

I myself have done the optimization above on this blog, for the results you can check this link

Speed ​​data is updated every week, and optimization results are stored in cache for 30 seconds. To see an updated optimization analysis, please wait for 30 seconds before restarting the test.

We can know that the blog speed data will be updated every week, so wait at least one week then check the blog address again to find out the changes in the Speed ​​PageSpeed ​​Insight column.

Some improvements After Removing CSS, Javascript, and Blogger Bundle Widgets

As for the effects given after doing the optimization above, here are some improvements that I made on this blog 

Blog pager

Please add or edit the CSS blog pager on the template


Contact form

The send button from the contact form widget will usually not work as before, please add this code after the HTML form of the contact code (Special contact form widget added on the static page)

<script src="" type="text/javascript"></script>
<script type="text/javascript">

if (typeof(BLOG_attachCsiOnload) != 'undefined' && BLOG_attachCsiOnload != null) { window['blogger_templates_experiment_id'] = "templatesV1";window['blogger_blog_id'] = '
7342017194742683056';BLOG_attachCsiOnload(''); }_WidgetManager._Init('//\x3d7342017194742683056','//','7342017194742683056');
_WidgetManager._RegisterWidget('_ContactFormView', new _WidgetInfo('ContactForm1', 'footer1', null, document.getElementById('ContactForm1'), {'contactFormMessageSendingMsg': 'Sending...', 'contactFormMessageSentMsg': 'Your message has been sent.', 'contactFormMessageNotSentMsg': 'Message could not be sent. Please try again later.', 'contactFormInvalidEmailMsg': 'A valid email address is required.', 'contactFormEmptyMessageMsg': 'Message field cannot be empty.', 'title': 'Contact Form', 'blogId': '
7342017194742683056', 'contactFormNameMsg': 'Name', 'contactFormEmailMsg': 'Email', 'contactFormMessageMsg': 'Message', 'contactFormSendMsg': 'Send', 'submitUrl': ''}, 'displayModeFull'));


Replace all codes marked with your URL and blog ID . Read more here: The Latest Ways to Add Contact Forms on the Blog

That's the answer to the bloggers' questions about How to Delete CSS, Javascript, and Blogger Bundle Widgets . Hopefully useful and cautious.
This is just an example, you can fill it later with your own note.