Posts

Showing posts with the label Wordpress

Defer Loading File CSS untuk Mengurangi Waktu Pemuatan Halaman

Image
Waktu buka halaman adalah salah satu hal penting bagi pengunjung Anda, dan sama pentingnya bagi mesin telusur. Saat menyertakan beberapa file JavaScript dan CSS , browser harus menunggu sampai semua file tersebut telah diunduh untuk merender halaman. Bergantung pada kecepatan koneksi, diperlukan beberapa detik untuk memuat semua sumber dan pengunjung harus menganggur sampai saat itu. Teknik yang kita bahas di sini akan memungkinkan browser untuk menampilkan halaman HTML awalnya tanpa gaya apapun, sehingga pengunjung setidaknya bisa mulai membaca isinya. Begitu halaman di-load, style sheet akan dimuat dan diterapkan tanpa memblokir thread utama. Ini mirip dengan menunda pemuatan tombol media sosial . Anda mungkin berpikir mengapa seseorang harus mengekspos tampilan halaman yang jelek tanpa memuat gaya! Itu benar, meski itu akan membuat kesan buruk. Jadi, pendekatan terbaik bisa termasuk kode CSS kritis yang diperlukan untuk memberi gaya pada konten paruh atas di halaman HTML i

Cara defer loading multi css

Image
Definisi dan Penggunaan Atribut defer adalah atribut boolean. Saat ini, ia menentukan bahwa skrip dijalankan saat halaman selesai diurai. Catatan: Atribut defer hanya untuk skrip eksternal (seharusnya hanya digunakan jika atribut src ada). Catatan: Ada beberapa cara skrip eksternal dapat dijalankan: Jika async hadir: Script dijalankan secara asynchronous dengan sisa halaman (script akan dieksekusi saat halaman melanjutkan penguraian) Jika async tidak hadir dan menunda hadir: Script dijalankan saat halaman selesai diurai Jika tidak ada async atau defer yang ada: Script diambil dan dijalankan segera, sebelum browser melanjutkan penguraian halaman Nah berikut kode untuk defer loading multiple css : <script type="text/javascript"> var loadCSSFiles = function() { var links = ["//example.com/css/custom.css", "//fonts.googleapis.com/css?family=PT+Sans", "//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css&quo

Cara membuat html sitemap wordpress tanpa plugin

Menjadi pengguna WordPress bertahun-tahun saya telah menemukan tidak banyak yang bisa salah dengan CMS open source tapi bila Anda memiliki terlalu banyak plug-in, akan sulit untuk memperbaruinya.   Bila memungkinkan, saya selalu mencoba membangun situs yang tidak akan bergantung pada mereka alasan utama untuk ini. Keamanan yang lebih baik sebagai plug-in adalah sumber utama hacks website Tidak ada jaminan plug-in akan dipertahankan atau diperbarui saat versi baru WordPress keluar Mereka menyumbat admin Mereka tidak selalu bekerja persis seperti yang Anda inginkan Berikut adalah sedikit kode yang saya gunakan untuk membuat Peta Situs HTML biasa.   Anda bahkan bisa memodifikasinya untuk menghasilkan sitemap XML juga dengan sedikit kerja. Yang harus Anda lakukan adalah menyalin kode berikut ke file functions.php dan akan menambahkan kode singkat HTML Sitemap ke situs Anda.   Hanya menempatkan [  htmlSitemap  ] pada halaman yang Anda inginkan untuk muncul. /*** *Taruh kode dib

Cara mengeksekusi kode PHP di Text Widget tanpa menggunakan Plugin

Image
Terkadang kita perlu mengeksekusi skrip PHP di widget teks namun secara default WordPress tidak hadir dengan fitur ini karena masalah keamanan. Anda bisa menggunakan beberapa plugin seperti PHP Text Widget dan PHP Code widget tapi mengapa ada orang yang menggunakannya saat kita bisa melakukannya dalam sepersekian detik. Anda tahu apa, Butuh waktu jauh lebih sedikit daripada memasang plugin. Edit file functions.php dari tema Anda saat ini dan tambahkan kode berikut di bagian akhir file. //Run php on text widget function php_execute($html){ if(strpos($html,"<"."?php")!==false){ ob_start(); eval("?".">".$html); $html=ob_get_contents(); ob_end_clean(); } return $html; } add_filter('widget_text','php_execute',100); Sekarang hapus cache jika Anda menggunakan Plugin Cache seperti cache WPSuper Cache atau W3 Total. Untuk mengecek kerja, Tempel kode PHP berikut di widget teks <? Php echo 'Halo Dunia !!!' ?> S

How to changing mobile browser address color bar to match layout blog

Image
Color Changing Mobile Browser Address Bar Layout To Match Blog This tutorial is simple but crucial, especially for the super perfectionist about design blog.   Ever see not, when opening a website or blog on the mobile phone, the color of the address bar of the browser that you use to change ngikutin blog layout?   Trivial indeed.   But make no mistake, this could make a little dazzled visitors tablets. Because the address bar which is usually white, instead turned when he open your blog.   To  change the color of the browser address bar  , the way really easy.   Just add a few lines of code HTML template settings wrote in your blog.   Here it is the code:   <!-- Color for Chrome, Firefox OS, Opera dan Vivaldi --> <meta content=' #2f303f ' name='theme-color'/> <!-- Color For Windows Phone --> <meta content=' #2f303f ' name='msapplication-navbutton-color'/> <!-- Color For iOS Safari --> <meta content='yes&#

Quickly Activating IONCUBE Loader In CPANEL

Image
Constrained in themes wordpress at the time of installation in self hosting for beginners like ane feel confused, gaptek dll. Let alone the first time to use cpanel ane rent, search tau and browsing-browsing is over the problem that ane face. It turns out a wordpress template that ane has already in encoder using ioncube loader so causing error during installation. Slightly explain IONCUBE Loader is a software that is used to mengencoder php code that can not be read by others. Now i will give you the introduction to the tutorial how to enable ioncube loader in cpanel for wordpress . 1. Login To Your Cpanel Example: nama-website-ente.com/cpanel Enter your username and password 3.Search (search) with the keyword "php" in your dpanboard cpanel column and select select PHP version, like this picture: 4. Find the file ioncube loader and select one file next checklist and immediately click the save button.

AMP Social Share for Blogger

Image
AMP Social Share for Blogger - Updated (Twitter, Google, Facebook & Whatsapp) Social Media & SEO Why should you think about Social Media when designing your blog's SEO strategy? Social Media is the new SEO, an important part of a Brand’s online presence. Let me explain the how part? SEARCH part- People nowadays use social media channels to find the latest news on the topic they're most interested in. For example, People active on Twitter can possibly discover their favorite blog's newest content just by searching for tweets with Twitter’s search engine. SEO part - The number of times a blog's page has been retweeted on social media help search engines understand that the blog is credible and should be ranked for keyword phrases. This is how social link can boost your blog's search rank, when implemented properly. Step 1: Crea

Easly Add Translate Widget To Page Blog With State Flag

Image
Add Translate widget to sidebar or page blog with state flags using javascript Not everybody on the planet comprehends the dialect we comprehend, thus consider the possibility that outsiders visit writes that we have yet they don't comprehend the dialect that we use in the blog we have. Interpreter gadget for web journals is the arrangement.  By introducing the gadget interpreter straightforward yet fascinating which I will share it, will make it simpler for outside guests who need to peruse the article that my companion made in a dialect that he gets it. How would I interpret? Simple, simple, guests essentially select the dialect of their nation by tapping on the banner where they originated from. How? Difficult? Translator Widget Display For a friend who wants to install the widget translator simple, my friend could see the tutorial below: 1. Buddy, you must be logged first on your blog. 2. select the  Layout  menu, the blogger dashboard. 3. In

Bagaimana Menggunakan SSL Certificate Gratis Dengan Bluehost Hosting

Image
Bagaimana Menggunakan SSL Certificate Gratis Dengan Bluehost Hosting Untuk menjalankan berbasis WordPress blog & website. Mereka juga salah satu yang direkomendasikan WordPress perusahaan hosting . Di masa lalu, saya telah berbagi banyak tutorial untuk membantu Anda menggunakan dan mendapatkan hasil maksimal dari Bluehost hosting. Berikut adalah beberapa yang populer: Cara Beli Hosting & Domain Dari Bluehost Hosting Cara Install WordPress Blog Pada Bluehost Hosting Anda Dalam tutorial eksklusif hari ini, Anda akan belajar bagaimana menggunakan sertifikat SSL gratis dengan Bluehost hosting Anda. Dengan menggunakan panduan ini, Anda akan bermigrasi blog WordPress An

Cara menambah syntax highlighter dengan prettyprint di blog tanpa mengurangi kecepatan loading website 100% Work Tested

Image
Bagaimana cara menambah syntax highlighter dengan prettyprint tanpa mengurangi waktu response loading blog. Nah kali ini saya akan membagikan script syntax highlighter untuk blog tanpa mengurangi kecepatan website sedikitpun. Bisa untuk blogger wordpress joomla drupal dan lainnya. Ga pake lama ini dia script nya: <script>function loadCSS(e,t,a){var n=window.document.createElement("link"),o=t||window.document.getElementsByTagName("script")[0];n.rel="stylesheet",n.href=e,n.media="only x",o.parentNode.insertBefore(n,o),setTimeout(function(){n.media=a||"all"})}function loadPrettyPrint(e){var t=document.createElement("script");t.src="https://cdn.statically.io/gh/google/code-prettify/master/loader/run_prettify.js";var a=document.getElementsByTagName("head")[0],n=!1;t.onload=t.onreadystatechange=function(){n||this.readyState&&"loaded"!=this.readyState&&"complete"!=t

Cara defer multiple external file js

Image
Teknik Defer loading multiple external javascript untuk mengurangi loading website secara dramatis. Nah kali ini saya akan share bagaimana cara mengurangi loading website meskipun mempunyai banyak eksternal javascript. Langkah: 1. Backup dulu template anda bila memakai CMS Blogger, Yang lainnya backup file asli yang akan di terapkan teknik defer ini. 2. Cut semua eksternal javascript (kecuali pemanggil jquery misal:  https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js bila theme atau template anda menggunakan framework yang menggantungkan jquery, misal blogger template EVO MAGZ buatan Mas Sugeng.). Lalu paste di notepad. Lalu buat kode berikut ini : <script type="text/javascript"> function downloadJSAtOnload() {  (function(scripts) {    var i = 0,     l = scripts.length;   for (; i<l; ++i ){    var element = document.createElement("script");    element.src = scripts[i];    document.body.appendChild(element);   }  })([ 'http://yo

How to Utilize Browser Caching

Image
How to Utilize Browser Caching To increase page loading and rendering speed up the blog, a method is to use browser caching. what profits of exploitation browser caching? the primary benefit is to reduce the interval of the server. that means that it uses caching to speed up loading pagespeed journal. How to speed up a blog score of pagespeed insight ? Read here: a way to speed up page loading insight pagespeed journal with google . Back to a way to make the most of browser caching on the blog. What it pengetian cache? Cache may be a set of information to be hold on as copies of the first data. occasional storage cache information is typically done to the information that has to be calculated or obtained by a special method so we have a tendency to don't got to perform difficult calculations or procedures repeatedly when the information are going to be used.

How to fix Feedburner feed double titles issue

Image
How to fix Feedburner feed double titles issue – Quick tip Most of the wordpress users syndicate their RSS feeds victimisation Feedburner. For people who don't understand, Feedburner may be a service that delivers your recent web log posts via email to your subscribers. have you ever ever seen your Feedburner subscriber stats count jumping up and down, it goes crazy occasionally and it's a glitch! Recently we have a tendency to found some totally different issue with our Feedburner feed that it's showing 2 feed titles like this (blog title web log title), examine the image below. we have a tendency to couldn't determine the matter that's inflicting this issue till we have a tendency to found the answer on-line. thus is your Feedburner feed showing double titles? If thus then it's easy to mend. Here we'll show you ways to mend Feedburner feed double t

Auto Defer Or Async Javascript in Wordpress

Image
async vs defer attributes Tags: The  async  and  defer  attributes for the  <script>  element have nice support now, so it’s time to learn exactly what they do! Legend <script> Let's begin by process what <script> with none attributes will. The HTML file are parsed till the script file is hit, at that time parsing can stop and a call for participation are created to fetch the file (if it's external). The script can then be dead before parsing is resumed. <script async> async downloads the file through out HTML parsing and can pause the HTML program to execute it once it'sfinished downloading.