Docmentation IDNXMUS
Docmentation IDNXMUS

Docmentation IDNXMUS

 
Thanks for purchasing the AMP HTML Goomsite template, Maybe some do not understand what is meant by AMP HTML? Accelerated Mobile Pages (AMP) are web pages designed based on open source specifications. The AMP page of validation results is stored in Google's AMP cache, which makes it faster to serve.

The AMP format is supported by multiple platforms, including Google Search. If the page listed in Google search results has a valid AMP version, Search may direct the mobile user to the cached AMP.

Goomsite template blogger is already valid AMP HTML, as recommended by google at this time. Goomsite is a blogger template that has been valid AMP HTML with modern Bussines display style so that the look of this template looks professional.

As for how to set this Goomsite template for valid AMP HTML, you can see below

SETTING

Logo



https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQACScsQJuQfda3XYXMPorXKj8lhGEzkMZscwZY3Zzu46RwQfOGo1dIuHak-Nq50OYleu_vDZUDDPLTGW16ii0DKWb_7uEZm_XmrXYfyc06RE-czX0URkKGD9bKJIpQXJdsYtcT3HMJ5t3/s1600/logo.png
Cari dan ganti url logo blog diatas, rekomendasik ukuran logo 300x300

Primary Menu

<nav id='menu'>
<input aria-label='Checkbox' type='checkbox'/>
<div class='check'>
<span></span><span></span><span></span>
</div>
<ul>
<li class='satu'><a href='/'>WINDOWS</a></li>
<li><a href='#'>ANDROID</a></li>
<li><a href='#'>GIVEWAY</a></li>
<li><a href='#'>PENULIS TAMU</a></li>
</ul>
</nav>

Ganti url # dengan url link tujuan



Menu Grid



<div class='nav-amp1'>
<div class='nav_grid'>
<ul class='sc_vertical'>
<li class='count-nav'><a href='#'><span class='icon'></span><span class='items'><span class='label'>Apps</span></span></a></li>
<li class='count-nav1'><a href='#'><span class='icon'></span><span class='items'><span class='label'>Theme</span></span></a></li>
<li class='count-nav2'><a href='#'><span class='icon'></span><span class='items'><span class='label'>Games</span></span></a></li>
<li class='count-nav3'><a href='#'><span class='icon'></span><span class='items'><span class='label'>Rom</span></span></a></li>
<li class='count-nav4'><a href='#'><span class='icon'></span><span class='items'><span class='label'>Tips</span></span></a></li>
<li class='count-nav5'><a href='#'><span class='icon'></span><span class='items'><span class='label'>Review</span></span></a></li>
<li class='count-nav6'><a href='#'><span class='icon'></span><span class='items'><span class='label'>News</span></span></a></li>
<li class='count-nav7'><a href='#'><span class='icon'></span><span class='items'><span class='label'>Tutorial</span></span></a></li>
</ul>
</div>
</div>

Ganti Url # dengan URL tujuan

Slider Corousel



<amp-carousel autoplay='' controls='' delay='3000' height='222' type='slides'>
<div class='textslide'>
<span>ROM FULL UPDATE</span>
<p>Kamu bisa menemukan segala jenis ROM di Web ini.</p>
<ul class='button'>
<li><a class='amp-button' href='#' rel='noopener' target='_blank' title='ROM'>CHECK</a></li>
</ul>
</div>
<div class='textslide'>
<span>TUTORIAL ANDROID</span>
<p>Ada berbagai macam tutorial yang mungkin bisa membantu.</p>
<ul class='button'>
<li><a class='amp-button' href='#' rel='noopener' target='_blank' title='Tutorial'>CHECK</a></li>
</ul>
</div>
<div class='textslide'>
<span>TIPS ANDROID</span>
<p>Tips Trick akan selalu di update setiap hari.</p>
<ul class='button'>
<li><a class='amp-button' href='#' rel='noopener' target='_blank' title='Tips'>CHECK</a></li>
</ul>
</div>
</amp-carousel>

Ganti Url # dengan URL tujuan

Menu Grid Icon CSS

.nav_grid ul li{text-align:center;width:23%;float:right;padding:5px}
.nav_grid .fa{color:#fff}
.nav_grid .count-nav .icon:before{content:"\f17b";font-family:FontAwesome;font-size:30px}
.nav_grid .count-nav1 .icon:before{content:"\f1fc";font-family:FontAwesome;font-size:30px}
.nav_grid .count-nav2 .icon:before{content:"\f11b";font-family:FontAwesome;font-size:30px}
.nav_grid .count-nav3 .icon:before{content:"\f10a";font-family:FontAwesome;font-size:30px}
.nav_grid .count-nav4 .icon:before{content:"\f0eb";font-family:FontAwesome;font-size:30px}
.nav_grid .count-nav5 .icon:before{content:"\f00e";font-family:FontAwesome;font-size:30px}
.nav_grid .count-nav6 .icon:before{content:"\f0ac";font-family:FontAwesome;font-size:30px}
.nav_grid .count-nav7 .icon:before{content:"\f044";font-family:FontAwesome;font-size:30px}

Ganti icon yang ditandai dengan warna kuning dengan icon FontAwetsome, untuk melihat bentuk-bentuk icon silahkan klik link dibawah ini

http://fontawesome.io/icons/

Setelah didapat jenis iconnya silahkan cari CSSnya di link dibawah ini

https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css


Search Box 

Search and replace URL demo-purpleamp.blogspot.co.id with your blog URL in HTML below

<amp-lightbox id='search_box' layout='nodisplay'>
<div class='lightbox'>
<button class='close_search' on='tap:search_box.close' role='button' tabindex='0' title='Close'>&times;</button>
<div id='search-box'>
<form action='/search' method='get' target='_blank'>
<input autocomplete='off' autofocus='autofocus' class='search-form' name='q' placeholder='Search...' required='required' type='text'/>
<input name='as_sitesearch' type='hidden' value='demo-purpleamp.blogspot.co.id'/>
<button class='resetbutton' type='reset'><svg viewBox='0 0 24 24'>
<path d='M19,6.41L17.59,5L12,10.59L6.41,5L5,6.41L10.59,12L5,17.59L6.41,19L12,13.41L17.59,19L19,17.59L13.41,12L19,6.41Z' fill='#000000'></path>
</svg></button>
</form>
<div class='note_search'>Press Enter To Search</div>
</div>
</div>
</amp-lightbox>


Icon Label on Homepage



/*---- Icon Tag ----*/
a.Islam:before {content:&quot;\f186&quot;}
a.Kuliner:before {content:&quot;\f0f5&quot;}
a.Traveling:before {content:&quot;\f267&quot;}
a.Diary:before {content:&quot;\f212&quot;}
a.Teknologi:before {content:&quot;\f0a0&quot;}
a.Internet:before {content:&quot;\f0ac&quot;}
a.Murottal:before {content:&quot;\f001&quot;}
a.Motivasi:before {content:&quot;\f06c&quot;}
a.Blogger:before {content:&quot;\f121&quot;}

Ganti icon yang ditandai dengan warna kuning dengan icon FontAwetsome, untuk melihat bentuk-bentuk icon silahkan klik link dibawah ini, sedangkan label warna hijau adalah nama label artikel sesuaikan dengan nama label anda, besar kecil font sangat berpengaruh.

http://fontawesome.io/icons/

Setelah didapat jenis iconnya silahkan cari CSSnya di link dibawah ini

https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css


Menu Footer


<div class='amp-menu'><ul>
<li><a href='#' rel='noopener' target='_blank' title='About'>About</a></li>
<li><a href='#' rel='noopener' target='_blank' title='Contact'>Contact</a></li>
<li><a href='#' rel='noopener' target='_blank' title='Privacy'>Privacy</a></li>
<li><a href='#' rel='noopener' target='_blank' title='Disclaimer'>Disclaimer</a></li>
<li><a href='#' rel='nofollow noopener' target='_blank' title='DMCA Protection'>DMCA Protect</a></li>
<li><a href='#' rel='noopener' target='_blank' title='Advertise'>Advertise</a></li>
<li><a href='#' rel='noopener' target='_blank' title='Sitemap'>Sitemaps</a></li>
</ul></div>

ganti tanda "#" dengan Url Tujuan


Social Footer


<div class='amp-soc'>
<a class='facebookBtn iconn' href='https://www.facebook.com/xxx' rel='nofollow noopener' target='_blank' title='Facebook'/>
<a class='instagramBtn iconn' href='https://instagram.com/xxx' rel='nofollow noopener' target='_blank' title='Instagram'/>
<a class='twitterBtn iconn' href='https://twitter.com/xxx' rel='nofollow noopener' target='_blank' title='Twitter'/>
<a class='googleplusBtn iconn' href='https://plus.google.com/xxx' rel='nofollow noopener' target='_blank' title='Google+'/>
<a class='youtubeBtn iconn' href='https://www.youtube.com/channel/xxx' rel='nofollow noopener' target='_blank' title='Youtube'/>
</div>

ganti tanda "#" dengan Url Tujuan


Sidebar - Fanspage

<amp-iframe width="300"
height="214"
sandbox="allow-scripts allow-same-origin allow-popups"
frameborder="0"
scrolling="no"
src="https://cdn.rawgit.com/basrimedia/media/d822862b/goomlike.html?page=goomsite">
</amp-iframe>

ganti username fanspage "goomsite" dengan username fanspage anda


Gambar Parallax

<noscript><img alt="seoamp" height="400" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiIseqaEqy4RASqK1pgLwOTWAAV-sA_VUKdfFkeW6-jMuk7iku2m5HG9i0AB4vMNNs0x_hDKgYu-fw-AQEEZATg45PFcoq7VUm_njKZQDP26PbV0G4SA2qqzVHHPpNjYy6-EkP1c9ItCUo/s1600/Health2.jpeg" title="seoamp" width="700"></noscript>

Ganti Url Gambar diatas dengan gambar yang akan dipublis sedangkan height = "400" and width = "700" adalah ukuran asli gambar


Gambar 2 dan seterusnya

<amp-img alt="AMP HTML" height="300" layout="responsive" src="https://4.bp.blogspot.com/-EyPxNdd-5Mg/V9oqDTiC2nI/AAAAAAAAGLM/4UxCZ3GrwB06xhnG6O1o23JhK_CZEV9ngCLcB/s1600/Kota%2BDengan%2BPenghasil%2BWanita%2BCantik%2BTerbanyak%2BDi%2BDunia.jpg" width="430"></amp-img>

Ganti Url Gambar diatas dengan gambar yang akan dipublis sedangkan height = "300" and width = "430" adalah ukuran asli gambar



Error 404

<div class='error-wrapper'>
<div class='nav-amp1'>
<div class='nav_grid'>
<ul class='sc_vertical'>
<li class='count-nav'><a href='#'><span class='icon'></span><span class='items'><span class='label'>Apps</span></span></a></li>
<li class='count-nav1'><a href='#'><span class='icon'></span><span class='items'><span class='label'>Theme</span></span></a></li>
<li class='count-nav2'><a href='#'><span class='icon'></span><span class='items'><span class='label'>Games</span></span></a></li>
<li class='count-nav3'><a href='#'><span class='icon'></span><span class='items'><span class='label'>Rom</span></span></a></li>
<li class='count-nav4'><a href='#'><span class='icon'></span><span class='items'><span class='label'>Tips</span></span></a></li>
<li class='count-nav5'><a href='#'><span class='icon'></span><span class='items'><span class='label'>Review</span></span></a></li>
<li class='count-nav6'><a href='#'><span class='icon'></span><span class='items'><span class='label'>News</span></span></a></li>
<li class='count-nav7'><a href='#'><span class='icon'></span><span class='items'><span class='label'>Tutorial</span></span></a></li>
</ul>
</div>
</div>
<div class='error_right'>
<div class='error_404'>
<h2>MAAF!</h2>
<h3>404 Error (Halaman Tidak Ditemukan)</h3>
<h4>Halaman ini mungkin sudah dihapus!</h4>
<hr/>
<p>Halaman yang Anda cari mungkin telah dihapus namanya diubah atau sementara tidak tersedia</p>
<p>Coba ikuti langkah berikut :</p>
<ul>
<li>Jika kalian mencari halaman melalui pencarian, pastikan katanya di tulis dengan benar.</li>
<li>Kalian bisa klik tombol <strong><a href='/' title='beranda'>Beranda</a></strong> dan coba cari kembali dengan kata yang benar.</li>
</ul>
</div>
</div>
</div>

Ganti icon yang ditandai dengan warna kuning dengan icon FontAwetsome, untuk melihat bentuk-bentuk icon silahkan klik link dibawah ini

http://fontawesome.io/icons/

Setelah didapat jenis iconnya silahkan cari CSSnya di link dibawah ini

https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css


Reaksi


Masuk di Layout - Blog Post




Subscribe


<div id='subscribeBOX'>
<form action='https://feedburner.google.com/fb/a/mailverify?uri=idnxmus' method='get' novalidate='' target='_blank'>
<h4>Langganan Artikel</h4>
<p>Berlangganan artikel Gratis langsung via email...</p>
<label>
<input aria-label='Masukkan Email' class='user-valid valid' name='email' placeholder='Your Email Address...' required='required' type='email'/>
</label>
<input class='Submitter user-valid valid' type='submit' value='Langganan'/>
<input class='user-valid valid' name='uri' type='hidden' value='idnxmus'/>
<input class='user-valid valid' name='loc' type='hidden' value='en_US'/>
</form>
</div>

Ganti Shortname Feeds "idnxmus" dengan shortname feeds anda


Comments Disqus

<div class='comments'>
<div id='open-comment'/>
<div class='disclaimer_box'>
<div class='content'>
<b>Comment Policy :</b> Silahkan tuliskan komentar Anda yang sesuai dengan topik postingan halaman ini. Komentar yang berisi tautan tidak akan ditampilkan sebelum disetujui.
</div>
</div>
<div aria-label='Buka Komentar' class='buka-komen' id='buka-komen' on='tap:komen.show,tutup-komen.show,buka-komen.hide,open-comment.scrollTo(&quot;position&quot;=&quot;top&quot;)' role='button' tabindex='0'>BERI KOMENTAR</div>
<div aria-label='Tutup Komentar' class='tutup-komen' hidden='' id='tutup-komen' on='tap:komen.hide,tutup-komen.hide,buka-komen.show,close-comment.scrollTo(&quot;position&quot;=&quot;top&quot;)' role='button' tabindex='0'>TUTUP KOMENTAR</div>
<div class='disqus' hidden='' id='komen'>
<amp-iframe expr:src='&quot;https://cdn.rawgit.com/Goomsite/bm/7bb5f069/disqus_amp.html?shortname=seoamp&amp;url=&quot; + data:blog.canonicalUrl' frameborder='0' height='300' layout='responsive' resizable='resizable' sandbox='allow-scripts allow-same-origin allow-modals allow-popups' width='600'>
<div aria-label='Disqus Comments' overflow='' role='button' tabindex='0'>Disqus Comments</div>
</amp-iframe>
</div>
</div>

Ganti seoamp Disqus tersebut dengan shortname disqus anda


Docmentation IDNXMUS

Docmentation IDNXMUS

Pesan via WhatsApp! - Proses Pemesanan Mudah ( via WhatsApp ) Instan checkout, tanpa registrasi / login.

Pesan via WhatsApp!

Proses Pemesanan Mudah ( via WhatsApp ) Instan checkout, tanpa registrasi / login.

Pengiriman Fleksibel - Kami menyediakan Layanan Pesan - Ambil ( Pickup ) & Pesan - Antar ( Delivery )

Pengiriman Fleksibel

Kami menyediakan Layanan Pesan - Ambil ( Pickup ) & Pesan - Antar ( Delivery )

Metode Pembayaran Lengkap - Bayar via Bank Transfer, E-Wallet atau PayPal? Bisa banget!

Metode Pembayaran Lengkap

Bayar via Bank Transfer, E-Wallet atau PayPal? Bisa banget!

Toko WA+

Template Blogger dengan fitur Toko Online berbasis WhatsApp + Keranjang Pesanan yang berguna untuk membantu "Pebisnis Online" menjual Produk maupun Jasa secara Instan & Efisien.

Hubungi Kami

Jl. Alamat Toko, No. 123 - Bandung 40241
Phone / WhatsApp. +62 89618885066
E-mail. info@website.com

Docmentation IDNXMUS https://aulianv23.blogspot.com/2018/07/docmentation-idnxmus.html
( 0 ) 0