tag:blogger.com,1999:blog-9978771030228518782024-03-14T13:16:18.397+07:00BLOG TUTORIALTutorial Cara Blogging, HTML, PHP, CSSUnknownnoreply@blogger.comBlogger65125tag:blogger.com,1999:blog-997877103022851878.post-74575235766116482292023-10-25T00:25:00.001+07:002023-10-25T00:25:11.205+07:0010 Platform Blog Terpopuler Dalam Dunia Blogging 2023<p>Halo sobat blogger semua, sudah lama tidak posting nih... Nah! Pada tahun 2023, masih banyak alat dan platform yang digunakan untuk membuat dan mengelola blog. Tentu ini akan menjadi sebuah referensi menarik dimana terdapat berbagai alat blog yang populer digunakan oleh blogger dan pemilik situs web untuk membuat, mengelola, dan mempublikasikan konten mereka.</p><table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto;"><tbody><tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjdn8zKv6hV2Zo_xFtMeL7vhHxuJ59RfE-90jPN5NVT9H2-xB9Ycu3xXItzSB-72WicVKuXQpGvgAymAdbrXBU70OdE8HCBgWPs8DK0gVQENHYQwUeI_PnE2DJ0LohZM1PbF5R0VcfiNUxJEiJnsuwfPbh8pa4xXMpRkTChtcUw52WNSgEpQE0HnVx1T6WH/s630/blog.webp" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="Ilustrasi Paltform Blog" border="0" data-original-height="340" data-original-width="630" height="216" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjdn8zKv6hV2Zo_xFtMeL7vhHxuJ59RfE-90jPN5NVT9H2-xB9Ycu3xXItzSB-72WicVKuXQpGvgAymAdbrXBU70OdE8HCBgWPs8DK0gVQENHYQwUeI_PnE2DJ0LohZM1PbF5R0VcfiNUxJEiJnsuwfPbh8pa4xXMpRkTChtcUw52WNSgEpQE0HnVx1T6WH/w400-h216/blog.webp" title="Ilustrasi Paltform Blog" width="400" /></a></td></tr><tr><td class="tr-caption" style="text-align: center;">Ilustrasi Platform Blog</td></tr></tbody></table><h2 style="text-align: left;">Berikut adalah 10 alat blog populer yang mungkin banyak digunakan:</h2><p></p><ol style="text-align: left;"><li><b>WordPress</b>: WordPress tetap menjadi salah satu platform blog paling populer. Ini adalah perangkat lunak sumber terbuka yang memungkinkan Anda untuk membuat blog dengan mudah dan sangat disesuaikan.</li><li><b>Blogger</b>: Blogger, yang dimiliki oleh Google, adalah platform blog sederhana yang dapat digunakan dengan mudah oleh pemula. Ini menawarkan hosting gratis untuk blog Anda.</li><li><b>Medium</b>: Medium adalah platform blog yang fokus pada konten berkualitas. Anda dapat dengan mudah membuat dan mempublikasikan artikel di sini.</li><li><b>Wix</b>: Wix adalah platform website yang fleksibel, dan Anda dapat dengan mudah membuat blog di dalamnya. Ini menawarkan banyak alat desain dan opsi penyesuaian.</li><li><b>Squarespace</b>: Squarespace adalah platform website yang sering digunakan oleh para seniman dan pengusaha kreatif. Ini menawarkan desain elegan dan mudah digunakan.</li><li><b>Ghost</b>: Ghost adalah platform blog yang dirancang untuk penulis. Ini adalah open source dan fokus pada menulis dan mempublikasikan konten.</li><li><b>Tumblr</b>: Tumblr adalah platform blog sederhana yang lebih berfokus pada berbagi konten visual, seperti gambar, GIF, dan video.</li><li><b>Joomla</b>: Joomla adalah sistem manajemen konten (CMS) yang kuat yang dapat digunakan untuk membuat blog serta situs web yang lebih kompleks.</li><li><b>Weebly</b>: Weebly adalah platform website yang ramah pengguna yang memungkinkan Anda untuk membuat blog dan situs web dengan cepat.</li><li><b>Drupal</b>: Drupal adalah CMS yang kuat yang digunakan oleh banyak pengembang web dan dapat digunakan untuk membuat blog yang sangat disesuaikan.</li></ol><div>Baca Juga: <a href="https://blog.fispol.com/2017/05/cara-membuat-blog-blogger-wordpress-baru.html">Cara Membuat Blog</a> dalam postingan sebelumnya.</div><p></p><p>Pilihan alat blog terbaik tergantung pada kebutuhan Anda, tingkat keterampilan teknis, dan tujuan blog Anda. Beberapa dari alat-alat ini menawarkan hosting gratis, sementara yang lain memerlukan biaya. Pastikan untuk memilih alat yang paling sesuai dengan kebutuhan Anda dan visi Anda untuk blog Anda.</p>Unknownnoreply@blogger.com0tag:blogger.com,1999:blog-997877103022851878.post-68190481863957438352017-10-16T09:28:00.001+07:002018-03-10T00:56:17.632+07:00Nama domain website yang bagus adalah unik dan menarikMempertimbangkan <b>nama domain website</b> sebelum memutuskan untuk membangun adalah wajib, gunakan pilihan terbaik sesuai dengan niche, produk, merek Anda dan yang bagus tentunya adalah unik dan menarik. Nah, Sebelum Anda bergegas keluar dan memilih nama domain atau nama situs web Anda, mungkin perlu ingin mempertimbangkan hal-hal berikut:<br />
<a name='more'></a><br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjEW5jP6-v8PNMF0rRVAOEAmtNyTtSWG2VEYKaIB8cVyDcfYxxCU2615tk7E9-lYzKOC1JbTcRAFwhC-n7YKzCWht9zCy2aKDDxhgIiY0F7LKsQXtFL3WCY2yDqbfWF0ytvayjnyFcnCww1/s1600/Jepretan+Layar+2017-10-16+pada+09.08.12.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="Nama domain website yang bagus adalah unik dan menarik" border="0" data-original-height="589" data-original-width="1281" height="294" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjEW5jP6-v8PNMF0rRVAOEAmtNyTtSWG2VEYKaIB8cVyDcfYxxCU2615tk7E9-lYzKOC1JbTcRAFwhC-n7YKzCWht9zCy2aKDDxhgIiY0F7LKsQXtFL3WCY2yDqbfWF0ytvayjnyFcnCww1/s640/Jepretan+Layar+2017-10-16+pada+09.08.12.png" title="Nama domain website yang bagus adalah unik dan menarik" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Nama domain website yang bagus adalah unik dan menarik</td></tr>
</tbody></table>
<h3>
<br />Nama Domain Sebaiknya adalah Nama Situs Web Anda</h3>
<div>
Setelah memilih nama domain maka selanjutnya adalah memberikan nama untuk situs website, namun Anda akan terkejut mengetahui bahwa tidak semua situs web yang bertebaran diinternet saat ini dinamai sesuai nama domainnya. Kita harusnya mengetahuihal ini bahwa penamaan situs setelah memilih nama domain adalah penting, adapun alasan sederhananya bahwa ketika orang memikirkan situs Anda, mereka akan memikirkannya berdasarkan nama.<br />
<br />
<blockquote class="tr_bq">
Baik kita ambil contoh sebuah nama domain, misalnya domain godaddy.com dengan judul website sebagai godaddy. Atau contoh lain adalah domain rumahweb, yang jelas situsnya berjudul: Rumahweb Hosting Indonesia.</blockquote>
</div>
<div>
<br /></div>
<div>
Jika anda telah dikenal dengan nama sebuah brand (contoh: alamat web), mereka akan tahu ke mana harus pergi ketika menari produk yang Anda jual. Misalnya, ketika orang memikirkan kaskus, mereka mungkin tidak perlu lagi bertanya-tanya apa alamat web yang akan mereka ketik ke browser mereka untuk sampai ke sana, mereka sebagaian akan memulai dengan mengunjungi kaskus.com / kaskus.co.id / dan nama identik lainnya. Jadi, Nama situs juga merupakan URL bagi pemirsa.<br />
<br />
Bayangkan jika bisnis Anda (atau situs web) disebut "Minyak Abc", namun ada orang lain yang memegang nama domain tersebut saat ini. Sebagai gantinya, Anda memiliki beberapa nama domain yang tidak jelas disebut, katakanlah, "bisnissayaxx.com". Coba bayangkan: Apa yang terjadi ketika pelanggan Anda mencoba mengakses web, mengingat bahwa Minyak Abc memiliki produk yang mereka inginkan, mereka akan ketik "www.minyakabc.com"?. Tentu saja ini akan sangat fatal, dimana Mereka akan berakhir di situs pesaing Anda.</div>
<div>
<br /></div>
<div>
Nama domain dan situs adalah hal untuk pelanggan atau pengunjung Anda ingat. Selain itu, Anda tidak secara serius berpikir bahwa mereka akan mencoba menghafal URL yang tidak terkait hanya karena Anda menginginkannya, bukan? Satu-satunya orang yang akan melakukan itu ke memori adalah pesaing Anda yang ingin membandingkan harga Anda. Bagaimana jika Anda tidak mendapatkan nama domain pilihan Anda? Ini sangat tergantung pada seberapa besar komitmen Anda terhadap nama itu.</div>
<div>
<br /></div>
<div>
Jika Anda memiliki nama merek yang Anda kenal, Anda mungkin tidak ingin membuang nama itu hanya karena Anda tidak bisa mendapatkan nama domainnya. Lagi pula, butuh banyak waktu dan uang untuk membangun nama itu. Jika demikian, Anda mungkin hanya ingin mencoba untuk membeli nama domain dari pemilik saat ini. Periksa informasi "whois" untuk domain tersebut, dan hubungi orang yang terdaftar untuk melihat apakah mereka bersedia menjualnya. Anda mungkin harus sadar bahwa mereka cenderung ingin mengenakan biaya yang lebih tinggi daripada yang biasanya Anda dapatkan saat membeli domain baru (dengan asumsi mereka ingin menjualnya di harga terbaik).</div>
<div>
<br /></div>
<div>
Di sisi lain, jika Anda baru memulai, Anda mungkin lebih memilih alternatif yang lebih murah untuk mencoba mendapatkan nama domain terlebih dahulu, dan kemudian memberi nama situs web Anda (atau bisnis) setelah domainnya Anda dapatkan. Jadi jika Anda telah mengakuisisi, katakanlah, nama domain "minyakbca.com", maka situs web dan bisnis Anda mungkin diberi nama "Minyak BCA" atau "minyakbca.com". Saya tahu ini sepertinya agak seperti memasang gerobak di depan kuda, tapi itulah kenyataannya jika ingin berhasil di Internet.<br />
<br /></div>
<h3>
Nama Generik Atau Nama Merek Domain?</h3>
<div>
Saya tahu bahwa sejumlah orang tampaknya menganggap bahwa nama domain Anda benar-benar pasti merupakan nama generik seperti "cars.com" jika Anda menjual mobil. Saksi, misalnya, berapa banyak uang yang nama generiknya dijual. Tapi serius, jika Anda mencari mobil, Anda mungkin sudah memiliki beberapa merek dalam pikiran, dan Anda lebih suka mencoba hal-hal seperti generalmotors.com atau toyota.com daripada hanya cars.com. Oleh karena itu, secara pribadi saya merasa bahwa nama domain yang sesuai dengan nama merek Anda sangat penting. Nama yang Anda gunakan untuk mengiklankan produk Anda adalah nama yang Anda inginkan untuk domain Anda, karena itu adalah hal pertama yang orang akan coba di browser mereka. Ini juga merupakan hal termudah yang harus mereka ingat, dan apa pun yang mudah diingat, akan lebih mungkin dicoba daripada nama domain yang tidak jelas.<br />
<br /></div>
<h3>
Nama Domain yang Panjang atau Pendek?</h3>
<div>
Nama domain dapat memiliki panjang sampai dengan 67 karakter. Anda tidak harus puas dengan nama domain yang tidak jelas seperti avab.com ketika maksud Anda adalah AcmeVideosAndBooks.com. Karena itu, tampaknya ada beberapa ketidaksepakatan tentang apakah nama domain yang panjang atau pendek lebih baik. Beberapa berpendapat bahwa nama domain yang lebih pendek lebih mudah diingat, lebih mudah mengetik dan kurang rentan terhadap kesalahan: misalnya, "getit.com" lebih mudah diingat dan kurang rentan terhadap kesalahan ketik daripada "connecttomywebsiteandobtainit.com".</div>
<div>
<br /></div>
<div>
Yang lain berpendapat bahwa nama domain yang lebih panjang biasanya lebih mudah pada memori manusia - misalnya, "gaepw.com" adalah urutan huruf yang tidak terkait yang sulit diingat dan diketik dengan benar, sedangkan jika kita memperluasnya ke bentuknya yang panjang, "GetAnEconomicallyPricedWebsite .com ", kita lebih cenderung mengingat nama domainnya. Beberapa argumen ini sebenarnya bersifat akademis. Ini semakin sulit untuk mendapatkan nama domain bermakna pendek. Saya belum memeriksa, tapi saya cukup yakin bahwa nama seperti "getit.com" dan "good.com" telah lama terjual.</div>
<div>
<br /></div>
<div>
Jika Anda berhasil mendapatkan nama domain pendek, kuncinya adalah memastikan kombinasi karakter yang bermakna dan bukan "gaepw.com" yang tidak jelas dalam contoh saya yang dibuat di atas. Nama domain panjang yang memiliki kata kunci situs Anda di dalamnya juga memiliki kelebihan karena harganya lebih baik di sejumlah search engine. Yang terakhir ini memberi preferensi pada kata kunci yang juga ditemukan di nama domain Anda. Jadi, misalnya, jika Anda memiliki situs dengan kompiler C ++ gratis dengan nama domain seperti freecpluspluscompilers.com, mungkin tarifnya lebih baik dalam pencarian " kompiler C ++ gratis " daripada halaman yang sesuai di situs saya yang lain, thefreecountry.com. </div>
<div>
<br /></div>
<div>
Untuk apa aku pergi? Aku akan mencari nama yang lebih pendek jika aku bisa mendapatkan yang bermakna, tapi aku tidak menolak nama yang lebih panjang. Namun, saya mungkin akan menghindari nama yang sangat panjang yang mencapai 67 karakter. Selain masalah yang jelas bahwa orang mungkin tidak dapat mengingat nama yang begitu panjang, itu juga merupakan tugas yang diketiknya dan mencoba memasukkannya sebagai judul di halaman web Anda.<br />
<br /></div>
<h3>
Nama dgn tanda penghubung?</h3>
<div>
Haruskah kamu mendapatkan nama dgn tanda penghubung? Ada beberapa hal yang perlu dipertimbangkan disini: Kekurangan Sangat mudah untuk melupakan tanda hubung saat mengetik sebuah nama. Banyak pengguna terbiasa mengetikkan hal-hal seperti freecpluspluscompilers.com namun tidak bebas-c-plus-plus-compilers.com. Mereka mungkin akan meninggalkan tanda hubung dan berakhir di situs pesaing Anda.</div>
<div>
<br /></div>
<div>
Ketika orang merekomendasikan situs Anda ke teman mereka secara verbal, memiliki tanda hubung di nama domain Anda menyebabkan kesalahan potensial lebih banyak daripada bila namanya tidak mengandung tanda hubung. Misalnya, bagaimana menurut Anda pengunjung Anda akan merujuk ke situs Anda jika diberi nama "acme-books- and-videos.com"? Mereka mungkin berkata, "Saya mengunjungi Acme Book and Videos dot com kemarin. Sungguh luar biasa." Teman mereka, mengingat komentar itu nanti, mungkin mengetik ke browser mereka "acmebooksandvideos.com". Ups Ini adalah rasa sakit di leher untuk mengetik. Cukup bilang.</div>
<div>
<br /></div>
<div>
Keuntungan Mesin pencari dapat membedakan kata kunci Anda dengan lebih baik dan dengan demikian mengembalikan situs Anda lebih menonjol dalam hasil pencarian untuk kata kunci yang terjadi pada nama domain Anda. Formulir yang tidak ditulis dgn tanda penghubung mungkin tidak lagi tersedia. Paling tidak begini, anda tetap mendapatkan nama domain yang anda inginkan. Secara pribadi, saya lebih memilih untuk menghindari nama ditulis dgn tanda penghubung jika bisa, tapi saya rasa itu sangat tergantung pada nama domain dan situasi Anda.<br />
<br /></div>
<h3>
Plural, "The", dan "My" Bentuk Nama Domain</h3>
<div>
Sangat sering, jika Anda tidak bisa mendapatkan nama domain yang Anda inginkan, registrar nama domain akan menyarankan bentuk alternatif dari nama yang Anda ketik. Misalnya, jika Anda menginginkan situs web.com, dan itu diambil (tentu saja), mungkin akan menyarankan formulir seperti: thewebsite.com mywebsite.com websites.com dan sejenisnya, jika mereka belum diambil juga. Pertanyaannya adalah, haruskah anda mengambilnya?</div>
<div>
<br /></div>
<div>
Pendapat pribadi saya adalah jika Anda mengambil formulir "the ..." dan "my ..." dari nama domain, Anda harus selalu ingat untuk mempromosikan situs Anda dengan lengkap nama. Jika tidak, orang cenderung lupa untuk membubuhkan yang diperlukan "yang" atau "saya". Oleh karena itu, saya selalu mengiklankan situs saya sebagai "thesitewizard.com" dan "thefreecountry.com" dalam bentuk nama domain lengkap mereka, bukan hanya "Negara Bebas" atau "Site Wizard" (tanpa artikel).</div>
<div>
<br /></div>
<div>
Di sisi lain, saya tidak akan mengambil bentuk jamak dari nama domain (misalnya, websites.com) jika saya juga tidak bisa mendapatkan "website.com", karena kemungkinan pengunjung gagal mengetikkan "s" dalam nama sangat bagus Pikirkan tentang pertengkaran nama terkenal antara etoys.com dan etoy.com. Banyak orang yang ingin pergi ke etoys.com ternyata akan etoy.com sebagai gantinya. Jika itu terjadi pada mereka, itu bisa terjadi pada Anda juga.<br />
<br /></div>
<h3>
COM, ORG, NET, dll?</h3>
<div>
Satu pertanyaan umum yang saya hadapi adalah dari orang-orang yang tidak bisa mendapatkan domain ".com" pilihan mereka, namun temukan ".net", ".org", ".biz", ".info" (dll) atau negara -specific top level domain (TLDs) (seperti .uk, .de, .us, .eu, dll) tersedia. Haruskah mereka mencoba untuk ini? Jawabannya tidak sesederhana yang Anda kira. Jika situs web atau bisnis Anda melayani masyarakat setempat, seperti bisnis pengiriman pizza atau agen perekrutan atau sejenisnya, maka masuk akal untuk mendapatkan domain khusus negara. Anda benar-benar mendapatkan keuntungan dari memiliki domain lokal semacam itu karena orang-orang di negara Anda tahu bahwa mereka berhadapan dengan entitas lokal, itulah yang mereka inginkan.</div>
<div>
<br /></div>
<div>
Lagi pula, jika mereka tetap tinggal di Inggris, mereka sepertinya tidak ingin mencoba memesan pizza dari pizzaparlour.com, yang menyarankan situs internasional. Anda akan lebih beruntung menamainya pizzaparlour.co.uk, yaitu dengan domain Inggris. Bagaimana jika Anda adalah situs atau bisnis yang bisa mendapatkan keuntungan dari khalayak internasional? Sebenarnya ada banyak mazhab pemikiran mengenai hal ini. </div>
<div>
<br /></div>
<div>
Saya hanya akan menyebutkan beberapa yang umum. Sekolah pemikiran yang pertama membahas premis bahwa lebih baik memiliki nama domain pilihan Anda "myperfectdomain" meskipun memiliki TLD ".net", ".org" atau beberapa sufiks spesifik negara lain, dari pada akhir up memilih nama domain yang tidak jelas karena alasan sederhana Anda tidak bisa mendapatkan pilihan pertama Anda. Dengan demikian mereka akan puas dengan nama domain seperti "myperfectdomain.de" atau "myperfectdomain.net" atau apalah. Terhadap ini adalah argumen bahwa jika Anda mendapatkan domain spesifik suatu negara, orang mungkin berpikir bahwa bisnis Anda hanya melayani negara tersebut. Another school of thought finds the alternative suffixes (like ".net", ".org", ".biz", ".info", etc) to be quite acceptable. For some, the ".org" suffix actually describes the non-profit nature of their organisation. So, for example, the famous Apache web server can be found at "apache.org". Yang lain puas dengan akhiran ".com" dan tidak kurang. </div>
<div>
<br /></div>
<div>
Sebagai alasan untuk argumen mereka, mereka mengutip algoritme peramban yang digunakan untuk menemukan situs web saat pengguna mengetikkan nama seperti "acme" ke browser. Rupanya, browser mencari nama domain "acme.com" sebelum mencoba "acme.net", dll. Dengan demikian, orang-orang yang melakukan itu akan dikirim ke situs pesaing Anda jika Anda juga tidak memiliki ekstensi ".com" . Memang, bahkan jika orang tidak bergantung pada browser mereka untuk menyelesaikan pengetikannya, banyak orang hanya menganggap ".com" akhiran saat mereka mengetikkan nama domain, jadi jika bisnis Anda adalah "Acme", mereka hanya akan menganggap nama domain Anda adalah "acme.com" daripada "acme.net" atau beberapa nama lainnya. Seperti yang Anda lihat, sebenarnya ada alasan bagus untuk menerima pandangan di atas.</div>
<div>
<br /></div>
<div>
Catatan kaki pribadi saya untuk argumen di atas adalah bahwa jika Anda mendapatkan nama domain dengan akhiran selain ".com", pastikan bahwa Anda mempromosikan bisnis atau situs web Anda dengan nama domain lengkap. Misalnya, jika nama domain Anda "dogandcatfood.net", pastikan bahwa saat Anda mengiklankan situs atau bisnis Anda, sebut saja "dogandcatfood.net" bukan "dogandcatfood". Jika tidak, orang akan menganggap ekstensi ".com" dan melakukan perjalanan ke tempat yang salah.<br />
<br /></div>
<h3>
Apa Nama Domain Yang Bagus Untuk Anda?</h3>
<div>
Jika hutan tersesat di pepohonan (atau sebaliknya) dalam argumen saya di sini, izinkan saya mengulangi poin utama artikel ini: dapatkan nama domain itu sebelum Anda memulai situs atau bisnis Anda. Jangan membuat kesalahan dengan mencoba memperbaiki nama domain Anda ke bisnis atau situs Anda. Situs pertama kami, fispol.com awalnya tidak memulai dengan nama itu, dan aku mengalami kerumitan yang sangat besar (dan kehilangan pengunjung) akibat perubahan URL. Jangan membuat kesalahan itu juga. Jika Anda memerlukan bantuan untuk mendapatkan nama domain tersebut, lihat artikel saya yang lain tentang <a href="http://blog.fispol.com/2013/01/mengganti-blogspot-dengan-domain-sendiri.html">cara mengganti blogspot dengan domain sendiri</a>.</div>
Unknownnoreply@blogger.com4tag:blogger.com,1999:blog-997877103022851878.post-62862043926335118062017-09-18T18:07:00.000+07:002017-09-18T18:07:31.620+07:00Web seluler dipercepat dengan Accelerated Mobile Pages (AMP) HTML<b>Accelerated Mobile Pages</b> (AMP), Tutorial Blog. Nah A EM P (kalau dieja secara indonesia) ini menjadi booming dang sering dibahas baru baru ini. Saya pertama mengetahui tentang amp html inipun beberapa bulan yang lalu, ya cukup telat memang dimana sejak tahun sebelumnya saya mengambil cuti untuk ngeblog yang akhirnya menyebabkan blog kesayangan ini sering terlambat update tutorial baru untuk kita semua. HHehehehehhe cuti bukan berarti berhenti ngeblog loh ya, hanya istirahat atau bersemedi saja. Dan kini kembali lagi hadir untuk meramaikan aktivitas blogging didunia internet blogger indonesia.<br />
<a name='more'></a><br />
<br />
Awalnya Saya pikir <b>AMP Html</b> ini akan berlalu begitu saja, tapi ternyata tidak. Fitur dari Accelerated Mobile Pages ini cukup perlu untuk dipertimbangkan karna memiliki manfaat dan efek yang besar dalam dunia blogging kita meskipun tanpa menerapkan AMP html pada blog atau website anda, masih berjalan baik baik saja. Ini bukan hanya tentang mempercepat blog kita diakses dari perangkat seluler namun juga bisa mempengaruhi penampilan sebuah blog atau halaman web di mesin penelusuran.<br />
<br />
Oleh sebab itu kali ini saya akan sedikit memberikan beberapa pengetahuan penting mengenai AMP <a href="http://blog.fispol.com/2013/03/belajar-HTML.html">html</a> kepada teman-teman blogger.Yuk kita pelajari bersama-sama!<br />
<br />
<h4>
Apa itu AMP?</h4>
Penjelajahan web seluler bisa menjadi pengalaman buruk karena lambat untuk mengakses sebuah situs, dengan proyek open source Accelerated Mobile Pages semua menjadi lebih cepat. Proyek ini bertujuan untuk mengatasi pengalaman frustasi dengan mempermudah penerbit membuat konten yang langsung dimuat di perangkat seluler.<br />
<br />
AMP merupakan sebuah kata singkat dari "Accelerated Mobile Pages" yang adalah sebuah proyek yang didukung Google. Proyek AMP adalah dirancang sebagai standar terbuka bagi semua penerbit atau siapa saja dengan tujuan utama agar dapat memuat halaman sebuah web diinternet dengan cepat di perangkat seluler.<br />
<blockquote class="tr_bq">
Secara resmi, tapatnya pada 24 Februari tahun 2016 lalu, Google mengintegrasikan daftar AMP ke dalam hasil penelusuran mobile / seluler mereka. Halaman yang menggunakan pengkodean AMP muncul di tempat-tempat khusus di hasil pencarian dengan tampilan unik yang disebut sebagai "AMP" website. Jika Anda masih penasaran tentang sejarah mendetail mengenai proyek tersebut, anda dapat mengunjungi situs AMP Project di situs https://www.ampproject.org/.</blockquote>
Jika ditanya secara pribadi maka saya bisa artikan bahwa AMP ini adalah sebuah struktur HTML yang ditetapkan sebagai cara supaya Perangkat seluler bisa mengakses sebuah halaman web dipenelusuran dengan lebih cepat karna telah dioptimasi. Jadi, amp ini bukanlah sebuah <a href="http://blog.fispol.com/2013/05/software-aplikasi-pembuat-website-desain-web.html">software</a>, bukan sebuah aplikasi, bukan juga bahasa pemrograman melainkan sebuah sistem terstruktur yang dibangun dengan HTML.<br />
<br />
Baca juga: <a href="http://blog.fispol.com/2017/06/editor-html-gratis-terbaik-untuk-macbook-macos-apple.html">Editor HTML terbaik MACOS</a><br />
<br />
Perancangannya yang sedemikian rupa, menjadikan sebuah halaman yang tadinya mungkin saja memiliki ukuran besar, bisa menjadi lebih cepat diakses oleh user karna dengan struktur HTML sebuah halaman AMP lebih sederhana dan diatur seminal mungkin. Ditambah dengan fitur pencadangan dari mesin pencari google yang kita sebut sebagai "web cache" sehingga server web sebagai sumber sebuah informasi dapat lebih terbantu untuk menyampaikan informasi kepada pengguna mereka.<br />
<br />
<h4>
Bagaimana cara AMP bekerja untuk Mempercepat Sebuah Halaman WEB?</h4>
<div>
Cepat sih cepat, tapi tentu saja ada yang masih bertanya-tanya tentang bagaimana sebuah halaman web dengan AMP bekerjasama dengan mesin penelusuran? Bagiamana cara menjadikan sebuah blog non amp menjadi amp? bagaimana mesin penelusuran google mengindeks sebuah situs yang memiliki halaman yang mendukung fitur tersebut?... kita akan cari tahu caranya !</div>
<div>
<br /></div>
<div>
AMP diprakktekkan terpisah dari konten HTML 'normal' Anda dapat menggunakan sintaks khusus di dalam kode sumber, yang dirancang untuk kecepatan dan memanfaatkan cache berbasis awan serta mekanisme pra-rendering.</div>
<div>
<br /></div>
<div>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhqAJqfvuWGep8h4NukLrc6ZuFIEPYArBgcozGFhUZ7s9CvtWU2Rv8Wp_gzol7j8f6nUSTYpVVEVJiBbcYrRCQDNqv3qPlYWH_mQNMCrVYHa-OfT8ZlB8NKIL5rFooW6KfMQfwuna2omlnn/s1600/AMP+-+Penusuran+-+Halaman+Web.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="Penelusuran AMP Website" border="0" data-original-height="466" data-original-width="733" height="406" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhqAJqfvuWGep8h4NukLrc6ZuFIEPYArBgcozGFhUZ7s9CvtWU2Rv8Wp_gzol7j8f6nUSTYpVVEVJiBbcYrRCQDNqv3qPlYWH_mQNMCrVYHa-OfT8ZlB8NKIL5rFooW6KfMQfwuna2omlnn/s640/AMP+-+Penusuran+-+Halaman+Web.jpg" title="Penelusuran AMP Website" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Penelusuran dan cara kerjanya dengan AMP Website</td></tr>
</tbody></table>
<br /></div>
<div>
AMP mengharuskan tag rel = "amphtml" ditempatkan di header halaman HTML setara, ini memberi tahu platform konsumen yang mendukung teknologi bahwa ada versi AMP di URL yang tersedia. Untuk menghindari duplikasi, AMP kemudian menyertakan tag rel = "canonical" di header yang mengarah kembali ke halaman HTML. Jika hanya ada versi AMP dari konten yang tersedia, maka itu hanya harus menampilkan tag kanonik yang menunjuk pada dirinya sendiri.</div>
<div>
<br /></div>
<h4>
Kelebihan dan Kekurangan AMP pada Website Atau Blog</h4>
<div>
Apa sih manfaat atau kelebihan yang bisa kita dapatkan dengan menerapkan kemampuan AMP diwebsite kita?</div>
<div>
<br /></div>
<div>
<div>
Manfaat yang jelas bagi pengguna adalah pengalaman web mobile yang jauh lebih cepat. Proyek AMP melaporkan melihat peningkatan Indeks Kecepatan antara 15% dan 85%. Anda dapat menemukan contoh AMP untuk diuji coba di sini , cukup kunjungi tautan itu di perangkat seluler Anda dan klik salah satu artikel berita.</div>
<div>
<br /></div>
<div>
Bagi penayang, AMPs akan berarti pemirsa yang lebih perhatian dan terlibat karena dapat menavigasi konten dengan mudah. Dari perspektif yang berpikiran lebih maju, jika teknologi menjadi populer, pengguna akan terbiasa dengan AMP sebagai standar. Penayang yang cepat mengadopsi akan melihat keuntungan dari lalu lintas ekstra pengguna yang mencari konten AMP dibandingkan dengan konten web tradisional di perangkat seluler mereka.</div>
<div>
<br /></div>
<div>
Selain itu, AMPs akan mendapatkan keuntungan dari update kinerja masa depan tanpa harus melakukan overhaul drastis terhadap kode sumbernya. Perbaikan akan dibangun sesuai dengan teknologi AMP yang menjadikan konten tersebut bertentangan dengan cara penulisan kode.</div>
</div>
<div>
<br /></div>
<div>
Lalu apakah AMP ini memiliki dampak negatif / kekurangan? ya, tentu saja sebuah fitur baru akan selalu mengalami pro dan kontra dalam praktek penerapannya secara umum.</div>
<div>
<br /></div>
<div>
Saat ini fungsi yang diberikan AMPs kepada penerbit terbatas, Anda dapat melihat perbandingan lengkap fitur yang tersedia di AMP dibandingkan dengan HTML di sini . Proyek AMP telah memperjelas bahwa fitur ini akan berkembang di masa depan namun untuk saat ini fokusnya adalah pada konten statis dan memastikan konten yang mengandung muatan teks dan citra paling banyak secepat mungkin. Ada juga argumen bahwa AMP tidak mengatasi masalah akar dari kecepatan pemuatan halaman.</div>
<div>
<br /></div>
<div>
Saat kami bergerak menuju standar responsif, di mana situs web menyesuaikan ukuran dan menyesuaikannya bergantung pada ukuran perangkat pengguna, tampaknya berlawanan dengan kemampuan untuk kembali ke halaman seluler terpisah saat AMP mempromosikannya. Penayang perlu mematuhi pedoman AMP yang ketat dan tetap sadar bahwa jika perangkat pengguna tidak mendukung JavaScript, maka tidak akan ada keluaran di layar.</div>
<div>
<br /></div>
<div>
Dukungan untuk memvalidasi AMP tersedia di Alat Pengembang Web untuk Chrome . Apakah AMP di sini untuk tinggal dan haruskah Anda mengadopsi AMP untuk konten Anda? Seperti halnya teknologi web baru, tingkat adopsi akan menjadi faktor kunci dalam menentukan apakah AMP ada di sini untuk tinggal atau tidak. Google baru saja menambahkan pelacakan AMP ke Google Analytics dan webmaster dapat menemukan bagian AMP di Google Search Console.</div>
<div>
<br /></div>
<h4>
Belajar Accelerated Mobile Pages (AMP) HTML</h4>
<div>
Kita akan belajar lebih mendetail pada kesempatan berikutnya, Saya akan berbagi disini yaitu mengenai bagaimana cara bekerja dengan amp html pada situs website atau blog, mengoptimasinya, dan informasi terkait lainnya mengenai AMP sebagai fitur percepatan web seluler di mesin pencari di masa depan.</div>
<div>
<br /></div>
<div>
Dan pada akhirnya... Jika ada pertanyaan mengenai konten AMP, atau pengembangan konten websitea Anda sesuai dengan praktik terbaik AMP, silakan berdiskusi bersama kami melalui kotak komentar.</div>
Unknownnoreply@blogger.com3tag:blogger.com,1999:blog-997877103022851878.post-23261664860376277102017-07-29T06:46:00.000+07:002017-07-29T06:49:28.211+07:00Bahasa Pemrograman apa yang harus dipelajari oleh pengembang Software?<b>Belajar pemrograman</b> - Saat memulai tekat Anda belajar didunia pemrograman, penting bagi siapapun calon pengembang software untuk menginvestasikan waktu lebih bijak dalam memilih untuk mempelajari sesuatu yang akan menguntungkan, dalam waktu dekat dengan hasil yang terlihat pada platform pilihan Anda, dan ini juga membuat Anda menyiapkan masa depan anda sebagai pengembang software yang berhasil.<br />
<a name='more'></a><br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEghOvp6sHTaeuF1SCjFKO1z6OLgo_7sX548wCGjEq36UQ8ZIeogG6LXS75UK8Q0pS9uQGv4lmv4-SC3XDUTVqwPsm9_PtdEov6DJUxjmB0wc2702DGhV5ppC59vVnAaDvpaJPFtoMabFIq_/s1600/Belajar+Bahasa+Pemrograman.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="Bahasa Pemrograman" border="0" data-original-height="472" data-original-width="716" height="210" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEghOvp6sHTaeuF1SCjFKO1z6OLgo_7sX548wCGjEq36UQ8ZIeogG6LXS75UK8Q0pS9uQGv4lmv4-SC3XDUTVqwPsm9_PtdEov6DJUxjmB0wc2702DGhV5ppC59vVnAaDvpaJPFtoMabFIq_/s320/Belajar+Bahasa+Pemrograman.png" title="Bahasa Pemrograman" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Gambar Ilustrasi: Bahasa Pemrograman</td></tr>
</tbody></table>
<br />
Pilihan untuk belajar bahasa pemrograman akan tergantung pada sejumlah faktor, jadi mari kita lihat karakteristik, kemudahan belajar, dan kemungkinan penghasilan yang bisa anda dapatkan. Disini kita juga akan sekaligus memperkenalkan beberapa kode untuk menampilkan "hallo dunia", seperti halaman pertama yang banyak ditulis saat belajar bahasa baru.<br />
<br />
Nah pada bagian pertama ini, kita akan meninjau bahasa pemrograman yang digunakan untuk perangkat lunak program - seperti pada aplikasi yang dijalankan pada komputer atau perangkat seluler. Lain kali kita akan belajar bahasa pemrograman web yang semakin penting, digunakan untuk membuat situs web dinamis dan antarmuka pengguna berbasis browser yang interaktif.<br />
<br />
Ada dua artikel sebelumnya dalam seri ini yang membahas beberapa dasar bahasa pemrograman, jadi jika Anda baru mengenal pemrograman, pastikan untuk membacanya juga:<br />
<br />
<ul>
<li><a href="http://blog.fispol.com/2013/03/belajar-HTML.html">Belajar Dasar HTML Terlengkap</a></li>
<li><a href="http://blog.fispol.com/2017/06/apa-definisi-fungsi-PHP-bahasa-pemograman.html">Definisi dan Fungsi PHP sebagai Bahasa Pemrograman</a></li>
<li><a href="http://blog.fispol.com/2013/05/software-aplikasi-pembuat-website-desain-web.html">Software Pembuat website terbaik untuk Belajar Web</a></li>
</ul>
<div>
<br /></div>
<br />
<div>
<h4>
Bahasa JAVA</h4>
Java bukanlah bahasa Jawa seperti yang Anda pikirkan, karna Java adalah adalah bahasa berorientasi objek penuh dengan seperangkat fitur yang luas berfokus pada kompatibilitas jejaring dan lintas platform. Aplikasi yang dibangun dengan Java dapat berjalan di hampir semua OS - meskipun kinerjanya tidak akan sebaik yang dirancang untuk berjalan secara native.<br />
<br />
Ini adalah bahasa pilihan untuk sebagian besar kursus Ilmu Komputer, dan akibatnya hampir setiap orang setidaknya memiliki sedikit pengalaman <u>pemrograman Java</u>. Oh ya, Aplikasi Android juga ditulis dengan dasar Java, meski Anda tidak bisa menjalankan aplikasi Java biasa di ponsel Android atau sebaliknya.<br />
<br />
<b>Seberapa besar potensinya Java menghasilkan uang untuk developer?</b><br />
<br />
Jika Anda dapat membuat aplikasi Java yang layak dipasarkan di pasar Android , maka dunia aplikasi bisa jadi peluang besar untuk seorang developer software. Bahkan kini ada banyak pekerjaan di tingkat perusahaan di Java, namun persaingannya bisa tinggi dan rendah.<br />
<br />
<br />
<blockquote class="tr_bq">
Catat : Jangan menyamakan Java dengan Javascript, karna 2 bahasa pemrograman ini merupakan bahasa yang sama sekali berbeda yang digunakan untuk pemrograman web - kita akan melihat ini lebih banyak waktu berikutnya.</blockquote>
<br />
<h4>
Bahasa C / C ++</h4>
Meskipun sebenarnya bahasa terpisah, Bahasa C dan C ++ sering dikelompokkan bersama, karena C ++ pada dasarnya adalah versi C yang disempurnakan, dimana selanjutnya menambahkan fitur berorientasi objek. C ++ adalah bahasa pemrograman pemrogram yang serius, yang menjadi dasar dari pemrograman banyak permainan komputer dan perangkat lunak Windows paling maju.<br />
<br />
Belajar bahasa pemrograman Ini membutuhkan kinerja yang tinggi, juga membutuhkan presisi lebih banyak pada bagian pemrogram dalam hal pengelolaan memori dan akibatnya memiliki kurva belajar yang curam. Tidak disarankan untuk pemula absolut.<br />
<br />
<b>Potensi C / C ++ bagi seorang developer software dalam menghasilkan uang</b><br />
<br />
Dengan persaingan yang sebenarnya kurang dari bahasa Java, pemrogram C ++ akan selalu diminati dan dibayar dengan baik dipasar (indrustri software), terutama di industri pemrograman game.<br />
<br />
<br />
<h4>
Bahasa C#</h4>
Dibaca sebagai C "Kress" dalam indonesia, ini adalah bahasa pemrograman yang merupakan kloning Microsoft dari Java (meskipun keduanya telah menyimpang dengan perbedaan yang lebih nyata) - tujuan umum yang berorientasi objek bahasa yang spesifik. Performanya bagus, meski tidak secepat C ++. Software yang ditulis dalam C # membutuhkan framework .Net untuk dijalankan dan hanya untuk Windows.<br />
<br />
<b>Peluang mengahsilkan uang bagi pemogram C#</b><br />
<br />
Ada banyak pekerjaan C # perusahaan di luar sana untuk solusi perusahaan, namun Anda mungkin tidak menghasilkan uang untuk perangkat lunak tunggal yang tidak seperti pengembangan seluler. Meski begitu, ini adalah bahasa yang menyenangkan dan mudah dipelajari bagi pemula, tentu saya akan merekomendasikannya jika Anda hanya ingin fokus pada Windows saja.<br />
<br />
Anda dapat mendownload Microsoft Visual Studio Express secara gratis, yang sangat membantu dengan perancangan GUI dan penyelesaian kode. Anda juga dapat menggunakannya untuk Visual Basic dan banyak bahasa pemrograman bermerek Microsoft lainnya.<br />
<br />
<h4>
Visual Basic</h4>
Kontribusi Microsoft lainnya, Visual Basic adalah bahasa berbasis aktivitas yang difokuskan pada aplikasi berbasis GUI sederhana. Event-driven berarti kode yang Anda tulis umumnya akan bereaksi terhadap apa yang dilakukan pengguna - apa yang terjadi saat mereka mengklik tombol itu, misalnya. Ini sangat mudah dipelajari dan mendapatkan aplikasi sederhana dan berjalan, namun pada akhirnya terbatas dan mungkin bukan yang terbaik untuk benar-benar mempelajari konsep pemrograman mendasar.<br />
<br />
<br />
<h4>
Objective-C / Cocoa</h4>
Ini adalah bahasa Apple Mac yang digunakan sebagian besar aplikasi OSX dan iOS. Secara teknis, Objective-C adalah versi C yang diperluas dengan fitur berorientasi objek, seperti C ++, namun hampir selalu dikombinasikan dengan kerangka kerja Cocoa untuk membangun antarmuka pengguna grafis dan fitur tingkat yang lebih tinggi pada platform Mac. Anda juga harus berhati-hati dengan manajemen memori.<br />
<br />
Sintaks dan konsep yang Anda butuhkan untuk belajar cukup kompleks dibandingkan dengan bahasa seperti Java atau C #, namun di sisi lain, Apple menyediakan lingkungan pengembangan bebas komprehensif ( Xcode ) dan alat yang mempermudah proses pembuatan aplikasi yang nyata dan dapat digunakan dengan mudah. . Ada juga banyak tutorial tertulis dan video di luar sana untuk membimbing Anda, jadi ini pasti lebih mudah diakses daripada C ++. Ini pada dasarnya adalah satu-satunya pilihan Anda untuk pengembangan OSX dan iOS, namun Anda dapat menulis untuk lingkungan desktop dan mobile Apple dengan satu bahasa.<br />
<br />
<br />
<h4>
Potensi bagi Developer Software</h4>
Dengan akun pengembang ($ 99 per tahun) dan aplikasi pembunuh, Anda berpotensi menghasilkan banyak - Apple telah membayar $ 2 miliar sejauh ini. Pengembang App Store memiliki kesempatan yang lebih baik daripada pengembang Android untuk menghasilkan uang dengan aplikasi berbayar, sementara pengembang Android cenderung melihat lebih banyak pengembalian iklan dalam aplikasi.<br />
<br />
Itu semua bahasa yang akan saya bahas hari ini, dan ini merupakan pengembangan perangkat lunak dunia nyata di lingkungan PC, Mac dan mobile. Sebelum saya mengecam komentarnya, saya telah memutuskan untuk menyertakan Python dalam daftar berbasis web karena sepertinya itu adalah tempat yang paling sering digunakan.<br />
<br />
Menulis kode di mac? dapatkan informasi mengenai <a href="http://blog.fispol.com/2017/06/editor-html-gratis-terbaik-untuk-macbook-macos-apple.html">Editor HTML Gratis Terbaik MacOS / MacBook</a><br />
<br />
Yang benar adalah bahwa sekali Anda memiliki dasar-dasarnya dalam bahasa apa pun, itu relatif mudah untuk belajar yang lain; Sama seperti mengetahui kanji bahasa cina membuat bacaan dan tulisan bahasa Jepang lebih mudah - bahasa pemrograman sering disilangkan dan dipinjam satu sama lain, berbagi seperangkat karakteristik dasar dan sintaks yang sama. Nantikan artikel berikutnya di mana saya akan melihat bahasa berbasis web seperti Javascript dan PHP.<br />
<br />
<blockquote class="tr_bq">
Artikel ini ditulis dan bersumber dari berbagai sumber yang menginspirasi perihal bahasa pemrograman dan pengembangan software bagi developer.</blockquote>
</div>
Unknownnoreply@blogger.com6tag:blogger.com,1999:blog-997877103022851878.post-28798141366392002072017-06-28T16:33:00.002+07:002017-06-28T23:48:17.682+07:00Apa Perbedaan Serta Persamaan HTML dan PHP?<br />
<u>Perbedaan HTML</u> dan <b>Persamaannya dengan PHP</b>, Apakah ada? Artikel ini saya tulis untuk menjawab pertanyaan pemula yang sedang <a href="http://blog.fispol.com/2013/03/belajar-HTML.html" title="belajar dasar html">belajar html</a> dan <a href="http://blog.fispol.com/2017/06/apa-definisi-fungsi-PHP-bahasa-pemograman.html" title="Definisi dan Fungsi PHP">Pemograman PHP</a> tentang 2 bahasa yang sangat penting dalam membangun sebuah situs web. Dengan tujuan utama dengan mengetahui lebih dalam mengenai perbandingan antara HTML dan PHP tersebut, akan menambah pemahaman kita semua. Yang jelas dan pasti adalah Bahasa markah dan pemograman ini sama-sama diperlukan ketika kita berbicara tentang pemograman web.<br />
<a name='more'></a><br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJPc3Gany0XFcd8Rj1R9vsBdJMPI1w_rWFO6NEqyRa0L0mmC6nvaajtfzhI06AM2nIDj3STnIWmJvpjC4UmXrHet6B0OCQHx_Q00FCSxusd5ZjT8HxMNz5nXDGiutcytzItsZStNJqW0ms/s1600/HTML+dan+PHP.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" data-original-height="513" data-original-width="900" height="364" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJPc3Gany0XFcd8Rj1R9vsBdJMPI1w_rWFO6NEqyRa0L0mmC6nvaajtfzhI06AM2nIDj3STnIWmJvpjC4UmXrHet6B0OCQHx_Q00FCSxusd5ZjT8HxMNz5nXDGiutcytzItsZStNJqW0ms/s640/HTML+dan+PHP.jpg" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">PHP dan HTM</td></tr>
</tbody></table>
<h4>
<span style="font-size: x-small;"> Bahasa HTML vs Bahasa PHP</span></h4>
Tapi disini kita tidak sedang mengadu, untuk menemukan mana yang baik atau yang buruk, HTML vs PHP... dan lain sebagainya. Namun artikel ini hanyalah sedikit pendekatan saja untuk pemahaman tingkat lanjut bagi pemula yang masih terawang-awang. Oleh sebab itu, saya akan mencoba menulis dengan bahasa yang sederhana agar mudah dipahami. Baiklah, tidak perlu berbasa-basi lagi, langsung saja kita kupas dan temukan intinya <a href="http://blog.fispol.com/2017/06/html-perbedaan-php.html" title="Apa beda html dan PHP"><span style="color: #444444;">Perbedaan PHP dan HTML</span></a>.<br />
<br />
<h3>
<u>Contoh Eksperimen Sederhana</u></h3>
Untuk mendapatkan jawaban yang tidak hanya sebuah teori, maka mempraktikkannya secara langsung tentu saja lebih memudahkan kita memahami apa perbedaan antara html dan php dengan tepat. Mari bereksperimen dengan contoh berikut ini.<br />
<br />
<h4>
1. File HTML dengan Script PHP</h4>
Buatlah sebuah file html baru, menggunakan text ataupun html editor yang biasa kita gunakan misalkan notepad plus-plus (notepad++). Sebagai contoh kita akan membuat file baru dengan nama <span style="font-family: inherit;">"</span><span style="font-family: "courier new" , "courier" , monospace;">perbedaan.html</span>" lalu berisikan dengan kode seperti dibawah ini:<br />
<blockquote class="tr_bq">
<span style="font-family: "courier new" , "courier" , monospace;"><html><br />
<head><br />
<title>Apa Bedanya Html</title><br />
</head><br />
<body><br />
<p>Ini adalah contoh script php yang berada didalam file HTML: <?php echo 'Hallo saya adalah PHP'; ?></p><br />
</body><br />
</html></span></blockquote>
Jangan lupa simpan file dengan ekstensi .HTML. Jika sudah maka kurang lebih jika kita mengaksesnya melalui browser maka akan tampil output seperti dibawah.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQfvSqiPH1FKlIG7P1t0UC7vQ2jX63b-lfKuZEGnAYB2PPUcusbMcRvOJ7_L0HRcqZ2uhWbg8xsBsHcZqDR5pV9erS7JVEM-6457iebzAZ4n6wIfYNoI-qScV9JylRKmNSrrdEQ6Wz9iy2/s1600/Output+HTML+dengan+Script+PHP.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Output Kode HTML" border="0" data-original-height="296" data-original-width="788" height="240" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQfvSqiPH1FKlIG7P1t0UC7vQ2jX63b-lfKuZEGnAYB2PPUcusbMcRvOJ7_L0HRcqZ2uhWbg8xsBsHcZqDR5pV9erS7JVEM-6457iebzAZ4n6wIfYNoI-qScV9JylRKmNSrrdEQ6Wz9iy2/s640/Output+HTML+dengan+Script+PHP.png" title="Output Kode HTML" width="640" /></a></div>
<br />
<h4>
2. File PHP berisi Kode HTML</h4>
Kemudian, buat juga berkas berekstensi PHP baru menggunakan text editor ataupun php editor yang biasa digunakan. Nah isilah file tersebut dengan contoh script php dibawah ini:<br />
<blockquote class="tr_bq">
<span style="font-family: "courier new" , "courier" , monospace;"><?php<br />echo '<html>';<br />echo '<p>';<br />echo '<center>Hai PHP!';<br />echo 'Ini saya kode html<center>';<br />echo '</p>';<br />echo '</html>';<br />?></span></blockquote>
Simpan script PHP tersebut sebagai file berekstensi .PHP. Lalu jalankan, kurang lebih maka akan menghasilkan sebagai berikut.<br />
<div class="separator" style="clear: both; text-align: center;">
<img alt="Output Script PHP" border="0" data-original-height="341" data-original-width="865" height="252" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj9cSPX4BN8_gCBGwKtHWiB52kRCtG4uoMuboHCxX4NSk1DFB5QEmPTkw8IWAY7DSOflrqpgrtjX7fbdse7WPTDvoiXpRdUHA6GsbvSUlWnBKAFap0ErTodBA5Rgg-SiMMGdsM7ZQFq3gTQ/s640/Output+PHP+berisi+Kode+HTML.png" title="Output Script PHP" width="640" /></div>
Catatan: Anda harus Menginstal Server dan PHP ( <a href="http://blog.fispol.com/2017/05/panduan-lengkap-instalasi-php-apache.html">Instalasi PHP Windows</a> / <a href="http://blog.fispol.com/2017/06/tutorial-instal-apache-php-mysql-linux-ubuntu.html">Instalasi PHP Linux Ibuntu </a>) terlebih dahulu untuk dapat menjalankan File php pada web browser komputer anda, Atau jika tidak mengupload file tersebut ke hosting dan mengeksekusinya. Bila kesulitan coba <a href="http://blog.fispol.com/2017/06/cara-download-instalasi-xampp-windows-linux-os.html">download dan install xampp</a> pada komputer anda.<br />
<br />
<h3>
Kesimpulan</h3>
<div>
Setelah melakukan eksperimen seperti contoh diatas maka kita sudah mulai bisa membedakan antara bahasa markup <u>HTML dan Script PHP </u>dan menghasilkan beberapa teori tentang kode dan script ini.</div>
<div>
<br /></div>
<div>
HTML merupakan sebuah bahasa Markah yang berdiri sendiri atau bisa merupakan hasil dari pemrosesan data oleh script pemograman seperti PHP dalam contoh ini. Pada contoh diatas HTML akan ditampilkan sebagai output yang kemudian diterjemahkan oleh browser (peramban web) sebelum ditampilkan kepada pengguna. Bahkan tanpa berkolaborasi dengan pomograman seperti php, sebuah file html masih akan bisa dijalankan, ini yang kemudian kita sebut sebagai halaman web statis. </div>
<blockquote class="tr_bq">
Kode HTML dapat langsung dijalankan disisi klien yang diterjemahkan oleh web browser. HTML digunakan sebagai output sebuah halaman website, Baik itu adalah halaman web statis maupun halaman web dinamis dengan bantuan script pemograman seperti contoh PHP</blockquote>
<div>
Sedangkan Script PHP adalah sebuah Bahasa Pemrograman yang hanya dijalankan pada sisi server. Hasilnya pemrosesan dari kode-kode php ini kemudian menghasilkan output. Adapun output dimaksud dapat berupa text, kode html, json dan lain sebagainya. Bahasa pemrograman PHP adan sangat diperlukan dalam membangun halaman web yang dinamis yang bekerjasama dengan Kode HTML.</div>
<div>
<br /></div>
<div>
Jadi Jawabannya adalah "YA", jika Anda ditanya mengenai:</div>
<div>
<ul>
<li>Apakah <a href="http://blog.fispol.com/2017/06/html-perbedaan-php.html" title="Perbedaan PHP dan HTML">HTML Beda Dengan PHP</a>? Jawab "Ya,Berbeda".</li>
<li>Apakah ada Persamaan PHP dan HTML? Jawab "Ya, 2 bahasa yang sama-sama diperlukan untuk membuat blog / website".</li>
<li>Apakah HTML dan PHP memiliki Hubungan? "Ya, untuk memproses data dan menampilkan situs web kepada pengguna, kedua bahasa ini bekerjasama dengan fungsi berbeda-beda".</li>
</ul>
</div>
Unknownnoreply@blogger.com2tag:blogger.com,1999:blog-997877103022851878.post-13642698184152738972017-06-25T11:54:00.000+07:002017-06-26T21:08:17.536+07:0010 Template WordPress Responsif (Responsive) Gratis 2017<b>Template WordPress Responsive</b> - Responsive adalah salah satu kemampuan website yang sangat diperlukan saat ini untuk membuat website yang lebih fleksibel guna memberikan pengalaman terbaik kepada pengunjung situs. Sekalipun itu adalah tema wordpress yang penuh dengan animasi yang memukau tapi belum tentu memiliki kemampuan beradaptasi terhada berbagai ukuran dari layar pembaca. Oleh sebab itu para pemiliki situs khususnya platform wordpress self hosted membutuhkan referensi template yang memiliki kemampuan responsif / mobilefriendly dan tentu saja menentukan pilihan pada tema terbaik.<br />
<br />
<blockquote class="tr_bq">
Sebagai tambahan referensi jika anda mungkin sedang mencari template wordpress untuk online shop mungkin artikel kami sebelumnya memiliki daftar lengkap untuk anda, coba cek dahulu di <a href="http://blog.fispol.com/2017/06/theme-template-wordpress-wp-toko-online-shop-terbaik.html" target="_blank">Template Wordpress Themes Toko Online Terbaik Terbaru</a> yang berisikan daftar tema berbayar maupun yang gratis.</blockquote>
<br />
<h4>
<span style="color: #073763;">
Bootstrap Css</span> dan <span style="color: #0b5394;">Template</span> Wordpress <span style="color: #b45f06;">Responsive</span></h4>
Bootstrap adalah salah satu kerangka kerja antar muka yang paling populer saat ini yang menyediakan koleksi alat gratis untuk membuat template dan aplikasi web berplatform WordPress. Bootstrap memungkinkan deainer atau pengembang <u><b>tema wordpress</b></u> memanfaatkan HTML, CSS, dan JavaScript untuk mengembangkan situs web <u>responsif </u>yang dapat beradaptasi tampilannya dengan layar smartphone atau ponsel cerdas pembaca.<br />
<br />
<h3>
Wordpress Themes <u>Responsive</u> Gratis Terbaik 2017</h3>
Nah berikut adalah daftar atau kumpulan tema yang merupakan rekomendasi untuk anda sebagai pilihan terbaik template wordpress. list tema WP responsif dibawah ini bersifat gratis yang dapat diinstal pada situs anda.<br />
<br />
Kumpulan template responsive ini berdasarkan kepopuleran dan review pengguna template tersebut, sehingga urutan terkadang tidak merupakan sebuah penentu peringkat untuk menentukan tema itu adalah terbaik, dan disini kami juga tidak berafiliasi dengan pengembang atau penjual thema manapun. Pilihlah sesuai dengan kebutuhan anda.<br />
<br />
<h4 style="text-align: center;">
<span style="color: #0c343d; font-size: large;">Hestia</span> Wordpress Themes Responsive</h4>
<blockquote class="tr_bq" style="text-align: center;">
Hestia adalah tema wordpress responsive dengan desain material untuk UKM dan Start-up. Dihadirkan dengan antarmuka yang indah dan modern, dibangun di atas tata letak satu halaman. Tema ini sangat sesuai untuk tujuan korporat maupun kreatif, karena memberikan tampilan yang bersih dan fleksibel, portofolio yang elegan, dan toko online yang mudah diingat. Hestia adalah template dengan desain yang sepenuhnya responsif yang artinya adalah mobile-friendly dan akan tampil sempurna di semua layar perangkat. Jika Anda ingin membuat konten yang tampak keren dengan cepat, yang Anda butuhkan adalah pembuat konten drag-and-drop top-of-the-line. Kabar baiknya adalah template ini kompatibel dengan SiteOrigin Page Builder - Bukankah ini Solusi gratis terbaik?</blockquote>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><img alt="Hestia - Wordpress Themes Responsive" border="0" data-original-height="405" data-original-width="931" height="278" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg7HPpB6h8fRLpSl9D1-W3tUh-t_v3MqdePpVAntsOwlaB9-S4nHE-WEHo-IAzm8kqLmE2vSnm7L5iML6iSj4Zdyk6eAXozvEu4R09fp_P7l7ip-ZAkSU45co0Eq-W-zrlvl5h9gVbKWALl/s640/Hestia+-+Wordpress+Themes+Responsive.png" style="margin-left: auto; margin-right: auto;" title="Hestia - Wordpress Themes Responsive" width="640" /></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Hestia - Wordpress Themes Responsive</td></tr>
</tbody></table>
Template wordpress gratis yang bersih dan indah yang menggunakan tren desain terbaru "<b>Material UI Kit"</b>. Tema Ini memiliki desain satu halaman dengan gulir halus dan tampilan artistik modern. Hestia juga mendukung fitur <a href="http://blog.fispol.com/2017/06/theme-template-wordpress-wp-toko-online-shop-terbaik.html" target="_blank"><span style="color: black;">toko online</span></a>, yang terisnpirasi dari website Pinterest, serta slider dengan fitur lengkap.<br />
<br />
<b>Fitur Terbaik dari Template Hestia</b>:<br />
<ul>
<li>Desain Responsif / Mobile Friendly</li>
<li>Material UI Kit</li>
<li>Footer Widgetized</li>
<li>Kompatibilitas WooCommerce dan website builder</li>
<li>Template SEO friendly</li>
<li>Integrasi Sendinblue (untuk bentuk buletin)</li>
<li>Live Customizer</li>
</ul>
<u>Download dan Demo Template</u> : https://justfreethemes.com/hestia/<br />
<br />
<h4 style="text-align: center;">
<span style="color: #073763; font-size: large;">Sydney</span> Wordpress Themes Responsive</h4>
<blockquote class="tr_bq" style="text-align: center;">
Sydney adalah template wordpress responsive kelas bisnis Gratis yang menyediakan cara cepat bagi perusahaan atau freelancer untuk sukses secara online. Sydney memungkinkan pemilik situs WP untuk penyesuaian penuh, seperti akses ke semua Font Google, kontrol warna sepenuhnya, mengelola tata letak, mengganti logo brand, slider layar penuh, gambar header, navigasi, menu dan banyak lagi. Wordpress Theme ini juga menyediakan blok konstruksi yang lengkap saat Anda butuhkan untuk membuat halaman depan yang menarik dengan cepat.</blockquote>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><img alt="Sydney - Wordpress Themes Responsive" border="0" data-original-height="581" data-original-width="1044" height="355" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj-zS5pPqbfGr5wrdr_QcQ3uEvpgJYPz1QbUkC1q6iOSwDNtNWzVexAv4D3IPETDCWOnGAeDFtyNsbP3Wsyk2aYX29dXKHSFN4Cm0cly2Uhosp-8Z_DSmKwJCIGccs9ObEWw69wRuqXf1rO/s640/Sydney+-+Wordpress+Themes+Responsive.png" style="margin-left: auto; margin-right: auto;" title="Sydney - Wordpress Themes Responsive" width="640" /></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Sydney - Wordpress Themes Responsive</td></tr>
</tbody></table>
Template WP responsif dengan tampilan bersih yang dirancang untuk bisnis dalam bentuk apapun, mendukung slider layar penuh, animasi bergulir mulus, dan indah. Tema ini memiliki tampilan profesional, footer yang bisa disesuaikan, dan desain yang simpel, selai itu template ini memiliki antarmuka modern dan indah, dan hadir dengan berbagai variasa warna.<br />
<br />
<b>Fitur Terbaik dari Template Sydney</b>:<br />
<ul>
<li>Tata letak responsif,</li>
<li>Terjemahan siap,</li>
<li>Latar belakang parallax,</li>
<li>Slider atau header gambar statis,</li>
<li>Link sosial,</li>
<li>Font Google</li>
</ul>
<u>Download dan Demo Template</u>: http://athemes.com/theme/sydney/<br />
<br />
<h4 style="text-align: center;">
<span style="color: #0c343d; font-size: large;">Zerif Lite</span> Template WordPress Responsive</h4>
<blockquote class="tr_bq" style="clear: both; text-align: center;">
<span style="text-align: start;">Tema WP Responsive Gratis serbaguna WordPress dengan tampilan satu halaman yang mobile friendly, dengan gambar full-width di latar belakang dan bilah menu berwarna putih sederhana di bagian atas. Muncul dengan desain yang elegan dan modern, yang bisa sangat sesuai dengan segala jenis bisnis Anda. Zerif Lite memiliki antarmuka interaktif dan penuh warna, dengan efek paralaks berkelas dan animasi yang hidup. Bahkan Anda dapat menggunakannya untuk toko online Anda juga. Template menyediakan desain responsif, kode yang bersih dan divalidasi, pengguliran paralaks halus, integrasi WooCommerce, tata letak blog, panel pilihan tema, pita khusus, efek pemuatan yang malas, terjemahan lengkap, Formulir kontak mudah, blok konten khusus, dan banyak pilihan penyesuaian lainnya.</span></blockquote>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><img alt="Zerif Lite - Template WordPress Responsive" border="0" data-original-height="391" data-original-width="926" height="268" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhny5GqjThDdT0t8hWA8Os5bQTENv7AQlEnQYwvyH4M49jjrOeRfmSIdWi12SetcJ33YjGY2snKnwfGWrk4enTYtJ69x5Xf6oLoSxFGeWDYxKdH5mUv1Y1ej55ssJLdAVJT46nCH2MaXBEJ/s640/Zerif+Lite+-+Template+WordPress+Responsive.png" style="margin-left: auto; margin-right: auto;" title="Zerif Lite - Template WordPress Responsive" width="640" /></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Zerif Lite - Template WordPress Responsive</td></tr>
</tbody></table>
Mengapa Zerif Lite? Tema interaktif, dirancang untuk menjadi tema satu halaman.Tema ini memiliki gambar dengan lebar penuh di latar belakang dan bilah menu putih sederhana di bagian atas. Warna utamanya adalah hitam dan putih, namun beberapa bagiannya adalah modifikasi klasik ke warna hijau lebih terang, kuning atau merah. Desain keseluruhannya elegan dan klasik. Template ini adalah Contoh bagus dari tema Bootstrap WordPress.<br />
<br />
<b>Fitur Terbaik dari Template Zerif Lite</b>:<br />
<br />
<ul>
<li>Kode bersih dan divalidasi,</li>
<li>Efek paralaks,</li>
<li>Integrasi WooCommerce,</li>
<li>Panel pilihan tema,</li>
<li>Lokalisasi (terjemahan lengkap),</li>
<li>desain responsif,</li>
<li>Fungsionalitas kontak mudah</li>
</ul>
<u>Download dan Demo Template</u>: http://justfreethemes.com/zerif-lite-free-wordpress-theme/<br />
<br />
<h4 style="text-align: center;">
<span style="color: #0c343d; font-size: large;">ShopIsle</span> Template WordPress Responsif</h4>
<blockquote class="tr_bq" style="text-align: center;">
Layar geser di beranda dan menyediakan pengguliran yang halus mewah dan berkelas, yang membuat pengalaman navigasi pembaca web lebih menyenangkan dan menyenangkan. Toko Anda akan memiliki tampilan yang lebih bersih dan indah, menampilkan produk dengan cara yang berkelas. Selain sebagai template wordpress yang Responsive, tema ini menawarkan animasi yang bagus serta halus. ShopIsle memiliki desain responsif, tautan sosial, dan siap dengan terjemahan. Template Ini juga menyediakan formulir kontak yang mudah untuk membantu Anda tetap berhubungan dengan audiens Anda serta bagian "Tentang Kami" sebagai cara memberi tahu pengunjung tentang siapa diri Anda dan proyek terbaik Anda. Produk toko dapat ditinjau oleh pengguna.</blockquote>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><img alt="ShopIsle - Template WordPress Responsif" border="0" data-original-height="395" data-original-width="926" height="272" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjg7kuJynaLtgsXogpGLq1h0WpQIULxzoDBOXpkoS4HvC_yc_z6hHbf_gF1631VR8W2z99OdtxaqHCi1oy1sneqjPll8kPN2BJaFnn31v3VoxCCyqPlKoGXIMwC0OD_HVcQCbYhWGCp6WdX/s640/ShopIsle+-+Template+WordPress+Responsif.png" style="margin-left: auto; margin-right: auto;" title="ShopIsle - Template WordPress Responsif" width="640" /></td></tr>
<tr><td class="tr-caption" style="text-align: center;">ShopIsle - Template WordPress Responsif</td></tr>
</tbody></table>
ShopIsle adalah tema elegan dan modern untuk e-commerce, dengan slider layar penuh dan desain yang bersih. Tema dibuat agar sesuai dengan jenis toko online dan memberi konten Anda tampilan yang segar dan ramah. ShopIsle memiliki pita video, scrolling yang halus, dan tata letak yang berkelas, yang akan membuat produk Anda menjadi sorotan.<br />
<br />
<b>Fitur Terbaik dari Template ShopIsle</b>:<br />
<ul>
<li>WooCommerce siap</li>
<li>desain responsif</li>
<li>Formulir kontak mudah</li>
<li>Footer widgetized</li>
<li>Terjemahan siap</li>
<li>Pita video</li>
<li>Link sosial</li>
</ul>
<u>Download dan Demo Template</u>: https://justfreethemes.com/shopisle/<br />
<br />
<h4 style="text-align: center;">
<span style="color: #0c343d; font-size: large;">ReviewZine</span> Responsive Themes</h4>
<blockquote class="tr_bq" style="text-align: center;">
Merupakan Template WordPress modern yang responsive dan bersih gratis untuk majalah teknologi, situs media berita dan media surat kabar, blog fashion pribadi, fotografi, ReviewZine responsif, datar, minimalis, ramah SEO, siap pakai Retina, yang dibangun dengan Bootstrap, dan memiliki tautan sosial. ReviewZine termasuk WPML, Photo Gallery Grid, Contact Form 7, Review Produk WP, SiteOrigin Page Builder, kompatibel dengan JetPack, temanya sangat mudah disesuaikan dan siap diterjemahkan.</blockquote>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKx45FGrl7_wLsFNzeYTmOjb1IRkS3r7vCyseL6tU9-3CQ50LAeKc_8o0r0JcltQ7_9selBkkdGMkyuti6dl0FN5F0FclRpjdq2MRFKE3QToKKQBMaaxX2OJmBuhqO8h_djBtKkQs2lvkq/s1600/ReviewZine+-+Responsive+Themes.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="ReviewZine - Responsive Themes" border="0" data-original-height="390" data-original-width="924" height="270" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKx45FGrl7_wLsFNzeYTmOjb1IRkS3r7vCyseL6tU9-3CQ50LAeKc_8o0r0JcltQ7_9selBkkdGMkyuti6dl0FN5F0FclRpjdq2MRFKE3QToKKQBMaaxX2OJmBuhqO8h_djBtKkQs2lvkq/s640/ReviewZine+-+Responsive+Themes.png" title="ReviewZine - Responsive Themes" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">ReviewZine - Responsive Themes</td></tr>
</tbody></table>
Tema WordPress responsive gratis bergaya modern ini cocok untuk publikasi ulasan, majalah, dan situs afiliasi. Dengan tampilan antarmuka serbaguna yang bersih, sangat sesuai untuk topik teknologi, namun juga bisa untuk hal-hal lainnya. Kelebihan template ini selain mobile friendly adalah memiliki sistem review / rating bagus yang disediakan oleh plugin WP Product Review.<br />
<br />
<b>Fitur Terbaik dari Template ReviewZine</b>:<br />
<ul>
<li>Desain responsif</li>
<li>Slider berfitur responsif</li>
<li>Terjemahan siap</li>
<li>Advanced rating chart (integrasi Review Produk WP)</li>
<li>Slider korsel untuk produk</li>
<li>Footer widgetized</li>
<li>Desain modern dan indah</li>
</ul>
<u>Download dan Demo</u>: https://justfreethemes.com/reviewzine/<br />
<br />
<h4 style="text-align: center;">
<span style="color: #0c343d; font-size: large;">ColorMag</span> Responsive Themes</h4>
<blockquote class="tr_bq" style="text-align: center;">
ColorMag adalah tema majalah gaya responsif WordPress yang gratis dan sempurna untuk tahun 2017. Cocok untuk berita, koran, majalah, penerbitan, bisnis dan situs apa pun.</blockquote>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiypw8XSfVswzxZ4erZTO21agsM9h9EM3QX1VxT7LBYlyjY4ZgTqMELpNDqvPF27KnNnMd6merSnAP9ohWrEuX4IwVaE3RJhHH2Y9muO85yNPD4GZYk-CWAgryJNrGa9KdLfqNsHexR3Zxl/s1600/ColorMag+-+Responsive+Themes.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="ColorMag - Responsive Themes" border="0" data-original-height="491" data-original-width="793" height="396" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiypw8XSfVswzxZ4erZTO21agsM9h9EM3QX1VxT7LBYlyjY4ZgTqMELpNDqvPF27KnNnMd6merSnAP9ohWrEuX4IwVaE3RJhHH2Y9muO85yNPD4GZYk-CWAgryJNrGa9KdLfqNsHexR3Zxl/s640/ColorMag+-+Responsive+Themes.png" title="ColorMag - Responsive Themes" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">ColorMag - Responsive Themes</td></tr>
</tbody></table>
Apa yang terbaik dari ColorMag adalah desain templatenya yang memiliki tampilan elegan dan cantik, dengan tombol warna-warni, fitur slider, dan struktur konten yang intuitif. ColorMag memiliki desain serbaguna, yang sesuai dengan topik yang ingin Anda tulis.<br />
<br />
<b>Fitur Terbaik dari Template ColorMag</b>:<br />
<ul>
<li>Desain responsif</li>
<li>Warna primer</li>
<li>Kotak dan pilihan tata letak yang lebar</li>
<li>Kompatibilitas WooCommerce</li>
<li>15+ area widget dan 5+ custom widgets</li>
<li>Ikon sosial dan menu yang bisa diubah-ubah</li>
</ul>
<u>Download dan Demo</u> template: https://themegrill.com/themes/colormag/<br />
<br />
<h4 style="text-align: center;">
<span style="color: #0c343d; font-size: large;">OnePress</span> WP Template Responsive</h4>
<blockquote class="tr_bq" style="text-align: center;">
OnePress adalah Tema WP dengan konsep satu halaman WordPress kreatif dan fleksibel yang gratis. Template ini dirancang untuk untuk bisnis, portofolio, agen digital, etalase produk dan situs web freelancer.</blockquote>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><img alt="OnePress - WP Template Responsive" border="0" data-original-height="949" data-original-width="1600" height="378" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh7oy3wt-PtfVpb1looXWqcq65sgtTdPjmTGwSTWfIRbkMscs6UR9dzdXrU1DtTMGiyXMK_hVgZmmBWZr8uLyGqL0FZaG06VSoSMxskwEd8K4n6tdwQhSqk0O8WawO_P3DHNnvxirP5MVwI/s640/OnePress+-+WP+Template+Responsive.png" style="margin-left: auto; margin-right: auto;" title="OnePress - WP Template Responsive" width="640" /></td></tr>
<tr><td class="tr-caption" style="text-align: center;">OnePress - WP Template Responsive</td></tr>
</tbody></table>
Wordpress theme modern dan responsive yang ramah pengguna, dirancang sedemikian rupa agar sesuai dengan situs bisnis/bisnis pemula, bisnis korporat dan kreatif, agen penggalangan dana, produk display, dan berbagai perusahaan online lainnya. OnePress memiliki tampilan yang elegan dan tata letak satu halaman yang rapi.<br />
<br />
<b>Fitur Terbaik dari Template OnePress</b>:<br />
<ul>
<li>Desain responsif</li>
<li>2 slide latar belakang</li>
<li>Dukungan WooCommerce</li>
<li>Template halaman kustom</li>
<li>Blok konten</li>
<li>Efek paralaks</li>
<li>Tersedia Lokalisasi</li>
</ul>
Download dan Demo: https://www.famethemes.com/themes/onepress/<br />
<br />
<h4 style="text-align: center;">
<span style="color: #0c343d; font-size: large;">NewsMag Lite</span> News Wordpress Template Responsive</h4>
<div style="text-align: center;">
Tema Gratis ini dirancang untuk webiste Majalah & Situs Berita Online, Buat konten visual lebih cantik yang sesuai dengan perhatian pembaca Anda. Ini adalah template wordpress responsive gratis untuk majalah yang cenderung mendekati topik lebih kompleks seperti ekonomi atau politik.</div>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><img alt="News Mag Lite - News Wordpress Template Responsive" border="0" data-original-height="598" data-original-width="1024" height="372" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh84XaHQ-9Ie9EaM_nC661S3IpizhPvBw0urTF3PwiBy0HZVCGPZ-9bfcGjPPjIKVvGpqFi25U9OAwvUCk28JmIx90RWaO2cKDw-zTf8um25jLOXaXEcTzMyUg2qDG3ebqaXAT-SuhlZaiF/s640/News+Mag+Lite+-+News+Wordpress+Template+Responsive.png" style="margin-left: auto; margin-right: auto;" title="News Mag Lite - News Wordpress Template Responsive" width="640" /></td></tr>
<tr><td class="tr-caption" style="text-align: center;">News Mag Lite - News Wordpress Template Responsive</td></tr>
</tbody></table>
Tema ini memiliki tampilan profesional, fitur slider yang bagus dan konten yang tersusun rapi. Desain dan tata letak template ini akan menekankan cerita Anda berkat tampilan tema yang bersih dan simple.<br />
<br />
<b>Fitur terbaik dari Template NewsMag Lite</b>:<br />
<ul>
<li>Upload logo Sendiri</li>
<li>Iklan Ready (ads)</li>
<li>Footer widgetized</li>
<li>Tampilan responsif dan Mobile Friendly</li>
<li>MendukungTerjemahan</li>
<li>Gambar Parallax</li>
</ul>
<br />
<u>Download dan Demo</u> template: https://www.machothemes.com/themes/newsmag-lite//mtref/themeisle/<br />
<br />
<h4 style="text-align: center;">
<span style="color: #0c343d; font-size: large;">AccessPress Parallax</span> WordPress Modern Resposinve</h4>
<blockquote class="tr_bq" style="text-align: center;">
AccessPress Parallax adalah template WordPress responsive yang indah dengan desain Parallax. Desain paralaks telah menjadi populer dan diadopsi karena memungkinkan Efek 3D. Dengan template mobile friendly ini, anda dapat menambahkan beberapa bidang ke produk Anda, ini adalah cara terbaik untuk menampilkan yang terbaik kepada pengunjung situs, Anda dapat menarik pengunjung Anda, interaktif, menarik, membuat Pengunjung situs menjadi penasaran, menyenangkan, terkejut, efektif untuk memicu tindakan dan banyak lagi. Karena paralaks sangat populer mengapa tidak memberi efek pada paralaks WordPress Anda! Dan semuanya gratis! Jika Anda mencari tema WordPress Gratis dengan efek Parallax, AccessPress Parallax adalah yang terbaik!</blockquote>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgshIiUpzNBC5jlx2CIIiQy3PxzFQRBzg7sAUXJrxySXgpiJ6zBbqDndB2wmsWIaYkatknzgGPP8fOuHN9nRCMsOctoPkjBwYf0EO37BvWYX8EYo3OQsUZDWgWwqhOCgn4UdRartahM18NF/s1600/AccessPress+Parallax+-+WordPress+Modern+Resposinve.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="AccessPress Parallax - WordPress Modern Resposinve" border="0" data-original-height="387" data-original-width="770" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgshIiUpzNBC5jlx2CIIiQy3PxzFQRBzg7sAUXJrxySXgpiJ6zBbqDndB2wmsWIaYkatknzgGPP8fOuHN9nRCMsOctoPkjBwYf0EO37BvWYX8EYo3OQsUZDWgWwqhOCgn4UdRartahM18NF/s640/AccessPress+Parallax+-+WordPress+Modern+Resposinve.jpg" title="AccessPress Parallax - WordPress Modern Resposinve" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">AccessPress Parallax - WordPress Modern Resposinve</td></tr>
</tbody></table>
AccessPress Parallax adalah tema satu halaman yang mengagumkan dengan pengguliran paralaks halus dan elegan dan Tampilannya yang sangat modern. Template wordpress ini sesuai dengan bisnis online apa pun, baik itu korporat maupun kreatif. Ini adalah pilihan yang baik untuk toko online dan portofolio. Secara keseluruhan, temanya terlihat cantik dan menggigit "woow".<br />
<br />
<b>Fitur Terbaik dari Template AccessPress Parallax</b>:<br />
<ul>
<li>Desain responsif / mobile friedly</li>
<li>Custom layout header</li>
<li>Pengaturan postingan</li>
<li>Penyesuaian warna</li>
<li>Animasi CSS3</li>
<li>Pengguliran paralaks</li>
<li>Fitur Slider</li>
<li>Integrasi WooCommerce ready</li>
</ul>
<u>Dowmload dan Demo</u> Template: https://accesspressthemes.com/wordpress-themes/accesspress-parallax/<br />
<br />
<h4 style="text-align: center;">
<span style="color: #0c343d; font-size: large;">Latte</span> Template Wordpress Responsive</h4>
<blockquote class="tr_bq" style="text-align: center;">
Latte adalah template parallax WordPress satu halaman yang dirancang khusus untuk pengembang, desainer dan freelancer, untuk menampilkan profil maupun portofolio mereka. Ada beberapa pilihan, termasuk bagian layanan, portofolio, peta, formulir kontak, testimonial, tabel harga, dan banyak lagi. Ditambah lagi template responsive ini sangat mudah untuk disesuaikan! Anda tidak memerlukan website builder lagi. Setiap hal bisa disesuaikan langsung dari WordPress Customizer. Template wordpress ini akan terlihat menarik di semua layar perangkat, mulai dari komputer layar besar hingga Samartphone dengan layar kecil. Dengan demikian, Anda tidak akan lagi memerlukan situs web seluler terpisah untuk situs web Anda!</blockquote>
<div class="separator" style="clear: both; text-align: center;">
<span id="goog_2050251761"></span><img border="0" data-original-height="654" data-original-width="1048" height="398" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgWsDkLKe4ATI6HNTv9ftcWxruqYjRHhQVmx38-XOEBxYmocIJqMlfB8LJ1NE3dZBd5ZGHWFefC7KN_4KFFgC7X9ed5os22EbH5LbEeyzRWyGvjNMdI7A9w8OQOX-5dyeWNZsd-_KjOsty8/s640/Latte+-+Template+Wordpress+Responsive.png" width="640" /><span id="goog_2050251762"></span></div>
<br />
Tema satu halaman modern untuk situs bisnis yang disediakan dengan versi gratis maupun pro alias berbayar. Muncul dengan pengguliran paralaks halus, sundulan lebar penuh lebar, dan tampilan yang amat sangat profesional. WP Theme ini juga menyediakan apapun yang dibutuhkan pemilik bisnis untuk mempromosikan layanan, keterampilan, dan karya terbaik mereka secara online dan gratis.<br />
<br />
<b>Fitur Terbaik dari Template Latte Responsive</b>:<br />
<ul>
<li>Responsif,</li>
<li>Pengguliran paralaks,</li>
<li>Mudah untuk menyesuaikan,</li>
<li>Terjemahan siap,</li>
<li>Warna tak terbatas,</li>
<li>Tabel portofolio dan harga.</li>
</ul>
<u>Download dan Demo</u> http://www.hardeepasrani.com/portfolio/latte/<br />
<br />
<h4>
Template <span style="color: #783f04;">WordPress Terbaik</span> Untuk Anda?</h4>
Demikianlah daftar template wordpress responsive, dimana kami telah menampilkan setidaknya ada 10 tema sebagai rekomendasi terbaik untuk menjadi pertimbangan bagi anda. Sekali lagi bahwa kami tidak berafiliasi dengan satu atau beberapa pengembang template wordpress tersebut, jadi urutan ini adalah berdsasarkan ulasan dan kepopuleran tema-tema tesebut di template market.<br />
<br />
Oh ya bagi anda yang ingin berimplementasi untuk mengetahui sejauh mana template pada daftar diatas bisa bekerja maksimal disemua perangkat, bisa langsung menguji kemampuan dari masing-masing template tersebut dengan cara "<a href="https://www.fispol.com/alat-mengetahui-mengecek-kecepatan-website-google/" target="_blank">Cek kecepatan Situs Web</a>" dengan google speed test apakah sudah mobile-friendly adatu belum.Unknownnoreply@blogger.com7tag:blogger.com,1999:blog-997877103022851878.post-34907969252358569152017-06-21T22:19:00.000+07:002017-06-21T22:19:00.781+07:00(Template) Wordpress Themes Toko Online Terbaik Terbaru 2017<b>Wordpress Themes, Online Shop</b> - Mengenai perkembangan toko online, Saat ini semakin banyak saja penjual aktif dan memulai toko online mereka di internet, dan mereka selalu mencari cara untuk menjual atau memasarkan produk-produk jualan mereka secara online memanfaatkan sumber daya yang ada seperti web berbasis wordpress dengan pilihan template yang beragam. Dan tentu saja itu bisa dimulai dengan <a href="http://blog.fispol.com/2012/12/cara-membuat-blog-gratis-di-wordpress.html" target="_blank"><span style="color: black;">membuat blog wordpress</span></a> terlebih dahulu kemudian menjadikannya sebagai situs wordpress online shop.<br />
<br />
<h4>
Memulai Toko Online dengan Worpress</h4>
Menjual online diinternet yang berkembang pesat adalah strategi jitu agar tidak ketinggalan teknologi marketing dari kompetitor, dan ini merupakan cara yang cerdas dan sangat baik untuk mencapai basis pelanggan yang lebih luas. Hal ini tidak hanya berlaku pada pasar lokal indonesia, karna toko online bisa menjangkau dengan sasaran global diseluruh dunia.<br />
<br />
Bagi pengusaha atau penjual menengah kebawah (UKM) mungkin saja tidak memiliki infrastruktur maksimal untuk mendukung situs web yang luas seperti pepenjual dengan skala besar. biasanya penjual online pemula tidak memiliki anggaran dana yang tinggi untuk membayar web developer untuk membangun situs wordpress yang fantastis, meskipun demikian mereka (pengusaha online shop) tetap ingin bersaing dipasar online. Kabar baiknya adalah platform WordPress adalah salah satu pilihan untuk menjawab persoalan tersebut, karena sejumlah tema dirancang dengan dukungan online shop (eCommerce).<br />
<h4>
<br />Template terbaik dengan Tampilan Yang Menarik Perhatian</h4>
Selain desain yang menarik, pengunjung toko online juga perlu diperhatikan kebutuhannya sebelum mendapatkan perhatian mereka. Biasanya calon pembeli menginginkan sesuatu yang unik dari situs-situs online shop baik itu wordpress maupun platform jenis lainnya. Mereka tidak ingin melihat struktur template yang yang sama, gaya yang sama dan konten yang sama di setiap situs jual beli. Oleh karena itulah wordpress online shop akan membutuhkan perawatan khusus untuk menjawab kebutuhan calon pelanggan. Kita tidak memerlukan template yang sempurna, karna itu tidak ada ! pilihlah salah satu thema saja dari yang terbaik untuk wordpress anda.<br />
<h4>
<br />Wordpress Themes untuk Toko Online (eCommerce)</h4>
Kami mencoba memberikan daftar tempplate dari semua jenis tema toko online untuk Anda pilih dan ini seharusnya menjadi satu-satunya daftar yang Anda perlukan untuk menemukan tema yang selalu Anda inginkan.<br />
<br />
Ada beberapa spesifikasi pada pencarian terpopuler terkait wordpress themes ini, ini akan disesuaikan dengan rencana penjualan, target, dan kebutuhan seorang pemilik situs tersebut, misalnya Template toko online yang keren, gratis, indonesia, online premium, seo friendly, wordpress responsive, wordpress gratis<br />
<br />
Jika anda sedang mencari Template toko online wordpress premium yang dapat didownload gratis maka disini tidak disertakan, bagaimana mungkin sesuatu yang premium bisa gratis.<br />
<div>
<br />
<div>
Daftar dibawah ini adalah kumpulan tema premium dan gratis dengan desain terbaik saat ini dengan fungsi bervariasi untuk menciptakan online shop yang profesional, unik dan sukses. Sebagian besar tema wordpress ini sangat bisa disesuaikan untuk digunakan untuk kebutuhan menjual semua jenis produk secara online.<br />
<br />
<h3>
Kumpulan Template Toko Online Wordpress Terbaik Versi Berbayar (Premium)</h3>
Berikut adalah daftar yang telah kami kumpulkan dari tema WP eCommerce premium (berbayar) yang merupakan pilihan terbaik saat ini, bisa digunakan sesuai dengan kebutuhan dari toko online yang sederhana hingga situs web wordpress yang serbaguna. Semoga anda menemukan jenis template baik yang berbayar premium, dan bisa memenuhi kebutuhan penjualan online Anda!<br />
<br />
<h4 style="text-align: center;">
<u>Shopkeeper Premium Wordpress Theme</u></h4>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgcoBU2M1ZvfLvNPGteChBSI3H7PKOWr5ms_KwwYYs0WbGQatsq5aHa4BwnAu7izsQGVTUSzSiQmIGUmsShsi9FQjOu-cv-xmuK4G-0gQiVV_61raiQB5g9WPb-hxsSe4hzGKq0dS0vhp06/s1600/Shopkeeper+Wordpress+Theme.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="Shopkeeper Wordpress Theme" border="0" data-original-height="900" data-original-width="1600" height="360" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgcoBU2M1ZvfLvNPGteChBSI3H7PKOWr5ms_KwwYYs0WbGQatsq5aHa4BwnAu7izsQGVTUSzSiQmIGUmsShsi9FQjOu-cv-xmuK4G-0gQiVV_61raiQB5g9WPb-hxsSe4hzGKq0dS0vhp06/s640/Shopkeeper+Wordpress+Theme.jpg" title="Shopkeeper Wordpress Theme" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Shopkeeper Wordpress Theme Untuk Toko Online</td></tr>
</tbody></table>
<blockquote class="tr_bq">
<br />
Template toko online serbaguna yang menawan, sederhana tapi memukau dengan desainnya yang kokoh. Halaman utama berisi slider full screen, berkat plugin Slider Revolution yang disertakan, yang menjadikan tema ini adalah pilihan sempurna untuk menarik perhatian calon pembeli di toko online wordpress anda.</blockquote>
Shopkeeper sebuah WP template yang siap sedia sebagai wordpress themes kategori eCommerce yang dirancang dengan baik dan dapat Anda gunakan untuk mempublikasikan portofolio pribadi atau perusahaan Anda, serta menampilkan produk Anda atau membangun toko online yang efisien untuk bisnis Anda.<br />
<br />
Template ini sangat fleksibel karna dikemas dengan pilihan yang membuat pengembangan website menjadi pekerjaan yang mudah. Shopkeeper memiliki desain dan tata letak yang mudah diubah serta dukungan dan kemampuan template yang responsif untuk memastikan bahwa pengunjung Anda akan memiliki pengalaman terbaik setiap berkunjung kehalaman situs web Anda.<br />
<br />
Selain diguanakan sebagai thema wordpress toko online, Shopkeeper memungkinkan anda untuk sesuatu yang lain karena template ini juga menawarkan tata letak untuk halaman rujukan, korporat atau agensi, gaya pribadi atau portofolio, slider lebar penuh, katalog siap pakai dan produk paralaks.<br />
<br />
Menarik lagi karna Shopkeeper juga menyertakan plugin Visual Composer yang memungkinkan Anda membuat layout lanjutan untuk setiap posting, halaman dan homepage situs Anda dengan menggunakan editor drag and drop back dan front end.<br />
<br />
Termasuk juga plugin Slider Revolution untuk membantu orang menghasilkan tayangan mencolok untuk konten, produk, dan gambar Anda pekerjaan yang mudah. Panel pilihan tema penjaga toko memungkinkan Anda mengubah tampilan situs eCommerce Anda. Dengan bantuan navigasi header lengket tema, Anda akan dengan mudah menemukan produk atau barang yang mereka cari di situs web Anda. Jika Anda memiliki pertanyaan atau masalah saat menyiapkan situs Anda, Anda dapat bergantung pada dukungan pelanggan yang andal. Pemilik toko sekarang bahkan lebih cepat dari sebelumnya menjadikannya salah satu tema WooCommerce tercepat yang ada saat ini.<br />
<br />
Jika slider full page terlalu besar untuk selera Anda, Anda dapat dengan mudah mengubahnya - Penjaga toko dilengkapi dengan 10 tata letak halaman yang berbeda, ditambah halaman "coming soon" yang telah dibangun sebelumnya. Selain itu, ia menyediakan puluhan layout untuk halaman toko, demo produk, portofolio, blog dan lain-lain (bahkan daftar keinginan). Dan dengan berbagai gaya header dan pilihan desain yang dapat disesuaikan sepenuhnya, Anda tidak akan memiliki masalah dalam menciptakan tampilan yang Anda inginkan untuk situs Anda.<br />
<br />
Mirip dengan banyak tema lainnya, Shopkeeper sepenuhnya terintegrasi dengan plugin WooCommerce dan mendukung terjemahan dengan plugin WPML. Ini sangat mudah dinavigasi dan juga responsif terhadap ukuran layar. Dan mudah bagi Anda, pemilik situs, untuk mendapatkan bantuan dengan dokumentasi ekstensif, update reguler dan staf pendukung yang berkomitmen.<br />
<br />
Anda tidak perlu menggunakan penjaga toko hanya sebagai toko - ini juga bagus untuk membuat katalog produk, mengelola persediaan atau menampilkan portofolio. Itulah yang membuatnya ideal bagi pemilik toko dan pengusaha.<br />
<br />
<h4 style="text-align: center;">
<u>Divi Premium Wordpress Themes</u></h4>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><img alt="Divi Premium Wordpress Themes" border="0" data-original-height="499" data-original-width="600" height="529" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgwUNSYolWVMMGwhOgCjin01hI8Z1bLUtfb8NAlArQctcuh4T40x4L1VMKHJYjcDjjCfJxu6q0D-IUBrOD6z3DBe-gTeIDF9AdbTZL5xpDVQjQuWDQrzwz_KgQWIQxSBTCo3eDsxeBNt4BF/s640/DIVI+Wordpress+Theme.jpg" style="margin-left: auto; margin-right: auto;" title="Divi Premium Wordpress Themes" width="640" /></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Divi Premium Wordpress Themes</td></tr>
</tbody></table>
<br />
Divi adalah pengembangan yang kuat dan dikembangkan secara ekstensif, estetis murni dan bersih dan sangat mudah disesuaikan, terstruktur sangat rapi dan sangat user friendly, didesain dengan serius dan sangat intuitif, profesional dan mudah ringan dan cepat loading, SEO friendly dan Retina siap merespon multiconcept WordPress, situs multiguna tema. Divi adalah tema yang sangat menyeluruh dan ambisius luas, solusi membangun situs menyeluruh menyeluruh dan lengkap untuk situs web besar dan kecil, pribadi dan profesional, komersial atau korporat, dan rookie webmaster dan berpengalaman.<br />
<br />
Divi Builder yang disertakan dengan fitur tema lebih dari 40 blok modul konten unik yang mudah disesuaikan yang siap Anda seret dan lepaskan ke dalam tindakan saat Anda membuat kerajinan dari halaman Anda sesuai dengan setiap kebutuhan Anda atau cukup mengedit dan biola dengan puluhan dokumen yang dikonfigurasi dengan hati-hati. Halaman template untuk segala macam tujuan. Divi sangat kuat saat disebarkan sebagai tema eCommerce. Situs demo serbaguna yang beragam mencakup beberapa situs eCommerce yang canggih dan ramping, yang menampilkan gerobak, halaman produk, pencarian bertenaga AJAX dan penyaringan dinamis dan kompatibilitas WooCommerce untuk pengalaman eCommerce WordPress yang tiada habisnya, tepat di luar kotak, tanpa harus menulis Satu baris kode sendiri Cobalah Divi hari ini, dan mulailah memasarkan barang daganganmu secara online.<br />
<br />
<h4>
</h4>
<h4 style="text-align: center;">
<u>Uncode - Template Wordpress</u></h4>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><img alt="Uncode - Template Wordpress" border="0" data-original-height="1101" data-original-width="1232" height="568" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgZ9ZxSUmQ0svrqIU8xozQgNCC4PJfd3d1cB1AKbRtLU_QWa9WARwxW9mEkzWD_ViA6Aft_lE_ZdWiub5BVFXihOQbICi8zQ44j_nSLKZdR4t2B7WjFEtJ_aEMrJck3WR3ztfTkQxX5ke2h/s640/Uncode+-+Template+Wordpress.jpeg" style="margin-left: auto; margin-right: auto;" title="Uncode - Template Wordpress" width="640" /></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Uncode - Template Wordpress</td></tr>
</tbody></table>
<br />
Uncode bersifat hangat dan mengundang, kuat dan serbaguna, sangat sederhana dan efisien, baik pengguna dan pengembang yang ramah, handal dan aman, aman dan cerdas dikembangkan, menarik dan dinamis, cerdas teknologi dan akal, multiconcept WordPress yang sangat responsif, tema situs multiguna. Uncode adalah tema yang kuat, yang sepenuhnya mampu keluar dari kotak pengelolaan segala jenis arketipe dan aplikasi situs web, mulai dari portofolio dan blog hingga solusi bisnis yang canggih, karena sifatnya yang sangat fleksibel dan mudah disesuaikan dan antarmuka pengguna yang sangat intuitif sehingga pengguna akhir di semua Demografi mudah dihubungkan dan ditangani.<br />
<br />
Uncode mencakup Komposer Visual yang disempurnakan dengan elemen yang kuat, Slider Revolusi dan Slider Layer, dan penyebaran WooCommerce yang menakjubkan dan terintegrasi secara keseluruhan dan fitur eCommerce lainnya yang relevan seperti halaman template toko yang banyak dan kode pendek ramah komersial seperti Pricing Plans, yang akan Menghemat banyak waktu dan mencakup pilihan penyesuaian ekstensif meskipun Panel Tema Tema Lanjutan yang memungkinkan Anda menyempurnakan tampilan dan nuansa situs Anda tanpa akhir. Uncode dibangun di atas Bootstrap, HTML5 dan CSS3, dan penyaringan portofolio AJAX yang hebat, menjadikannya sebagai themefor yang sempurna dari berbagai jenis situs web eCommerce di berbagai industri. Mulai menjual, dengan Uncode!<br />
<br />
<h4 style="text-align: center;">
<u>Navy - Wordpress Template</u></h4>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhSM9gID9XPFvAil5DwfApbWOYlzNmRBzIkhWdUPD97ghxOlledF35T8REMFLidnAumVL46-zY9LqIkykMdIrx5d3-ogIveIUJqLtXXlADkfHdz3XgaALXe7qvcyvQEcSdoet0mgT4nRRcY/s1600/Navy+-+Wordpress+Template.jpeg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="Navy - Wordpress Template" border="0" data-original-height="707" data-original-width="613" height="640" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhSM9gID9XPFvAil5DwfApbWOYlzNmRBzIkhWdUPD97ghxOlledF35T8REMFLidnAumVL46-zY9LqIkykMdIrx5d3-ogIveIUJqLtXXlADkfHdz3XgaALXe7qvcyvQEcSdoet0mgT4nRRcY/s640/Navy+-+Wordpress+Template.jpeg" title="Navy - Wordpress Template" width="552" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Navy - Wordpress Template</td></tr>
</tbody></table>
<br />
Navy adalah multiconcept WordPress yang ramping dan responsif, tema situs bisnis multiguna. Angkatan Laut adalah kerangka kerja yang fleksibel untuk kerajinan cepat dari situs web modern yang mengagumkan. Anda tidak perlu menulis baris kode dengan Angkatan Laut untuk mendapatkan hasil yang berkualitas. Angkatan laut sangat sesuai untuk berbagai industri dan aplikasi. Bisnis jauh dan luas menemukan di Angkatan Laut sebagai mitra terpercaya untuk usaha mereka. Angkatan laut mengemas pembangun canggih untuk layout, header, footer dan Megamenus Anda juga.<br />
<br />
Dalam beberapa klik mudah Anda dapat menyesuaikan segala sesuatu tentang situs web Angkatan Laut Anda. Dan dengan fitur komersial yang kuat yang didukung oleh WooCommerce, memasarkan barang dagangan Anda sangatlah mudah. Itu sebabnya situs eCommerce berbondong-bondong ke Angkatan Laut. Template toko onlinenya yang hebat terintegrasi secara mulus dengan paket plugin WooCommerce. Ini memberi Anda fitur canggih dan canggih untuk ditawarkan kepada klien dan pelanggan Anda. Keranjang belanja, katalog produk dan halaman dan jauh di bawah tenda menunggu di dalam. Plugin seperti Essential Grid dan Revolution Slider membuat pengalaman navigasi yang mempesona. Impress pelanggan Anda dengan portofolio produk animasi dan lightbox khusus. Mengesankan mereka dengan Parallax ramping dan latar belakang video. Tetap terhubung dengan audiens Anda dengan milis langganan dan blog kreatif. Angkatan Laut adalah semua yang anda butuhkan untuk sukses dalam eCommerce!<br />
<br />
<h4 style="text-align: center;">
<u>Kalium - Wordpress Theme</u></h4>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgUztC8EyhElUxufFaFFYsRjQJypG0fGpLdhqWoxjrN-7LzL6g1RFEgG78mfoKIdQfu0HOUVzq5ViWN8l-k-Xd7iHl4WssXi2cSuRpfBOTJGARM3DLUqLcQX2tUkp9ljhtnul6tJYx1v_UG/s1600/Kalium+-+Wordpress+Theme.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="Kalium - Wordpress Theme" border="0" data-original-height="300" data-original-width="590" height="321" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgUztC8EyhElUxufFaFFYsRjQJypG0fGpLdhqWoxjrN-7LzL6g1RFEgG78mfoKIdQfu0HOUVzq5ViWN8l-k-Xd7iHl4WssXi2cSuRpfBOTJGARM3DLUqLcQX2tUkp9ljhtnul6tJYx1v_UG/s640/Kalium+-+Wordpress+Theme.png" title="Kalium - Wordpress Theme" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Kalium - Wordpress Theme</td></tr>
</tbody></table>
<br />
Serbaguna dan user friendly, Kalium adalah salah satu tema WooCommerce serbaguna terbaik di WordPress. Kekuatannya berasal dari serangkaian fitur yang beragam, bekerja sama untuk memberikan fleksibilitas dan pengaturan personalisasi yang kaya. Ada lebih dari 600 font Google, dengan opsi untuk menambahkan font hasil personalisasi melalui panel admin. Kalium memiliki kulit untuk setiap kesempatan, karena mampu beradaptasi dengan kebutuhan Anda. Ini memastikan bahwa situs Anda akan selalu sesuai dengan visi Anda. Anda dapat menambahkan dimensi lain ke konten Anda, dengan menerapkan beberapa font ikon khusus. Ada 4 paket, dengan total 800 ikon ditawarkan. Selain itu, tersedia variasi footer: corporate, minimal dan simple.<br />
<br />
Pasar online hari ini harus menyesuaikan diri dengan meningkatnya popularitas perangkat mobile. Kalium benar-benar responsif, mengingat tampilannya luar biasa di semua platform. Baik itu tablet atau smartphone, halaman Anda akan selalu mengesankan pengunjung. Admin bisa mendapatkan keuntungan dari ini juga. Aksesibilitas seluler memungkinkan mereka memperbarui dan mengelola konten saat mereka dalam perjalanan. Tentu saja, situs Anda akan merespons perintah sensor sentuh. Ikon dan gambar berkualitas tinggi ditampilkan, dan mereka diuji secara menyeluruh untuk memastikan bahwa mereka adalah Retina-siap. Stagnasi bisa merusak bahkan blog terbaik sekalipun. Syukurlah, kualitas tulisan Anda bisa ditampilkan dalam beberapa cara, karena berbagai format blog.<br />
<br />
Sementara proses instalasi bisa mengintimidasi, pengguna Kalium bisa bernafas lega. Ini menawarkan metode konstruksi situs web tercepat dan termudah. Installer satu klik dapat mengimpor posting, halaman, slider, pilihan tema dan widget dalam hitungan saat. Bahkan seorang anak pun bisa membuat toko bertenaga WooCommerce yang sukses. Kode tema disederhanakan dan dioptimalkan untuk kesempurnaan. Hal ini menghasilkan beberapa kecepatan pemuatan yang sangat cepat.<br />
<br />
<h4 style="text-align: center;">
<u>Jevelin - Wordpress Template</u></h4>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><img alt="Jevelin - Wordpress Template" border="0" data-original-height="586" data-original-width="1244" height="299" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiX-G5xJZt4zCZCx6lVLEyKZiYoKJXix3u2I0XMTLHqyojgOpPJpmP2dBLBz4e3VutYyKf3xyzoPa9gO6Hhuut_e_dDWr_bJzxPDaQ9Gq8ebmYdpwoNG4C69vQOPONPrEZ7sjFA-NMIGWvS/s640/Jevelin+-+Wordpress+Template.png" style="margin-left: auto; margin-right: auto;" title="Jevelin - Wordpress Template" width="640" /></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Jevelin - Wordpress Template</td></tr>
</tbody></table>
<br />
Jevelin adalah situs tema multiguna premium yang andal, andal, intuitif dan mudah digunakan, cerdas dan kaya fitur, mudah responsif. Jevelin sangat cocok untuk menangani tuntutan berbagai arketipe dan kasus penggunaan situs dengan mudah dan tanpa perlu mengkodekan sendiri. Jevelin dikemas dengan situs demo dan template halaman yang mengagumkan sehingga menghemat banyak waktu dan usaha dalam menyiapkan situs web Anda, dan dengan konten gambar demo yang disertakan dalam resolusi tinggi, situs web Anda siap untuk ditayangkan segera setelah Anda menambahkan konten Anda sendiri. Dan selesaikan semua kustomisasi grafis yang Anda inginkan. Jevelin sangat ideal bagi para webmaster yang ingin membuat toko online modern yang mudah digunakan dengan semua fitur yang Anda harapkan dari etalase online yang kompeten di pasar saat ini dan jauh di bawah tenda.<br />
<br />
Siap melayani pasar transaksi harian semudah toko barang buatan tangan atau pemasaran produk digital, kemampuan komersial Jevelin, yang didukung oleh paket plugin WooCommerce eCommerce standar industri memberdayakan Anda untuk memasarkan barang Anda ke dunia pada umumnya tanpa hambatan, dan dengan gaya visual yang fasih. Untuk boot Lihat Jevelin hari ini, dan mulai memindahkan produk dan melakukan penjualan!<br />
<br />
<h4 style="text-align: center;">
<u>Thegem - Wordpress Template</u></h4>
<div class="separator" style="clear: both; text-align: center;">
<img alt="Thegem - Wordpress Template" border="0" data-original-height="300" data-original-width="590" height="324" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKVUip0pM18469_Rh-YFZrB-55UqQOw1J_GFtqnAX4gJKhZlL-j2KMxkS3Rmtadq0i2Xj89UrGgdr2VWIt3pYQGjQCcJ9ri9QU7qeldOKmBx7u1tS9tChYpNVzHcsQMQK45KDa4hps7REM/s640/Thegem+-+Wordpress+Template.jpg" title="Thegem - Wordpress Template" width="640" /></div>
<br />
TheGem adalah situs tema multiguna kreatif yang sangat inovatif dan sangat menarik, mudah berubah, modern dan sangat bergaya. TheGem adalah toolkit yang bagus untuk pengembangan situs web yang canggih di seluruh spektrum aplikasi dan bidang minat yang mungkin, dengan alat khusus untuk beragam skenario dan kebutuhan yang sesuai dengan situs web di bidang pribadi, profesional, bisnis atau perusahaan dengan mudah.<br />
<br />
TheGem mengemas lebih dari 40 demo konseptual unik bagi Anda untuk memulai, masing-masing interpretasi yang berbeda tentang kemampuan TheGem dan melayani tujuan yang berbeda namun dapat disesuaikan dengan semua berkat komposer Visual dan kumpulan TheGem dari lebih dari 60 elemen VC unik dengan lebih dari 250 pengaturan yang dapat disesuaikan untuk mereka. Menyiapkan toko online lebih mudah dari sebelumnya dengan TheGem, karena penerapannya secara visual dari paket plugin WooCommerce eCommerce, yang dikombinasikan dengan puluhan gaya halaman toko yang tampan dan beragam pilihan yang dapat disesuaikan untuk katalog produk, galeri gambar dan portofolio produk Anda. , TheGem adalah pemasar modern dan mahir dari hampir semua produk atau layanan. WPML diaktifkan sejak awal, TheGem dikemas dengan tiga alternatif bahasa dan dapat diperluas ke hampir semua bahasa dengan mudah. Cobalah TheGem hari ini!<br />
<br />
<h4 style="text-align: center;">
<u>Merchandiser - WooCommerce WordPress Theme Premium</u></h4>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEggIBY-vD4_YsEt18b5Z9zMDwjBEB5WyHYeft_zG-2T06gCXNRltPn8PquPizn7KWGNygdKr8MtPQ_hG4ypDeDI2ovkUG53WeAgIHjSw9ZWUFqGmyJ15MyQdm93UxQnXgte52-T5slqUL7a/s1600/Merchandiser+-+WooCommerce+WordPress+Theme+Minimalistic.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="Merchandiser - WooCommerce WordPress Theme Minimalistic" border="0" data-original-height="616" data-original-width="616" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEggIBY-vD4_YsEt18b5Z9zMDwjBEB5WyHYeft_zG-2T06gCXNRltPn8PquPizn7KWGNygdKr8MtPQ_hG4ypDeDI2ovkUG53WeAgIHjSw9ZWUFqGmyJ15MyQdm93UxQnXgte52-T5slqUL7a/s1600/Merchandiser+-+WooCommerce+WordPress+Theme+Minimalistic.png" title="Merchandiser - WooCommerce WordPress Theme Minimalistic" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Merchandiser - WooCommerce WordPress Theme Minimalistic</td></tr>
</tbody></table>
<br />
Merchandiser adalah tema situs WooCommerce yang cerdas dan ringkas, ringkas namun sederhana, intuitif dan cerdas, cepat responsif dan WordPress. Merchandiser adalah platform membangun situs web khusus yang berpusat pada penyediaan situs web modern yang menarik dan mulus dengan kemampuan mendalam dalam menangani perdagangan online dengan berbagai cara dan untuk seribu relung dan pasar yang berbeda. Merchandiser memiliki kombinasi fitur, plugin, templat halaman dan elemen yang tepat untuk membuat proses pembuatan dan perancangan situs web toko online unik Anda sendiri dengan cepat. Visual Composer dan Live Customizer membuat karya pendek dari semua tata letak tata letak, dibantu oleh berbagai template tata letak yang menarik.<br />
<br />
Penyebaran fitur canggih yang intuitif, seperti Keranjang Belanja Off-Canvas yang menarik dan mobile-friendly serta Tampilan Cepat Off-Canvas untuk memindai detail produk individual dalam sekejap membuat pengalaman browsing pengguna akhir yang lancar dan menyenangkan yang menghasilkan Peningkatan kunjungan kembali dan lebih banyak bisnis dalam jangka panjang. Dengan integrasi WooCommerce yang menyeluruh, Merchandiser siap keluar dari kotak agar Anda mulai mengeluarkan barang dagangan dan mengumpulkan pembayaran dari banyak sumber yang beragam, memaksimalkan pendapatan Anda di sekitar. Coba Merchandiser hari ini, dan perhatikan nomornya jadi hitam, dan tetap hitam!<br />
<br />
<h4 style="text-align: center;">
<u>KALLYAS - Online Shop Modern WordPress Theme</u></h4>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><img alt="KALLYAS - Online Shop Modern WordPress Theme" border="0" data-original-height="300" data-original-width="590" height="323" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEihCVvZVlw051y_97tALvO8bzkH3_dwsvc7VAIQ1i8aFxqytbLmfNmnnecS0C2g8ChZSRU82uVqBpL5WSZ05bhZqOSTCXfggYrLZy8Y1Mn06T5cpofDxRlZhmopPI9-jKTO6mdJgRg7aE77/s640/KALLYAS+-+Online+Shop+Modern+WordPress+Theme.jpg" style="margin-left: auto; margin-right: auto;" title="KALLYAS - Online Shop Modern WordPress Theme" width="640" /></td></tr>
<tr><td class="tr-caption" style="text-align: center;">KALLYAS - Online Shop Modern WordPress Theme</td></tr>
</tbody></table>
<br />
KALLYAS adalah tema situs serbaguna WordPress yang luas dan fleksibel, fleksibel dan lentur, modern dan komprehensif, sangat responsif. KALLYAS adalah hasil dari proses perancangan dan pengembangan yang ekstensif dan berdedikasi, menghasilkan alat membangun situs web yang luas dan ambisius, yang dengan cepat cocok untuk sejumlah aplikasi, mulai dari pribadi hingga profesional, korporat hingga komersial, KALLYAS mampu melakukan semuanya. Dalam ranah situs web perdagangan online, KALLYAS secara khusus berbakat, mengingat di luar kotak integrasi paket plugin wooCommerce e-Commerce standar industri dan presentasi visual dan grafisnya yang kohesif dalam bentuk template halaman toko online siap pakai yang indah. Berfungsi penuh dan siap untuk pergi hidup dari hari pertama, mengikuti proses impor yang disederhanakan dan kemudian cukup menambahkan katalog produk Anda.<br />
<br />
Dengan pilihan portofolio produk yang sangat dinamis dan sangat dapat disesuaikan dan beragam halaman template, menampilkan produk Anda ke khalayak online besar-besaran tidak pernah mudah dicapai dengan gaya dan kualitas terbaik. Pengkodean berbasis bootstrap yang responsif secara menyeluruh membuat KALLYAS native cross kompatibel dengan perangkat, platform dan sistem operasi di seluruh papan, langsung memperluas basis pelanggan Anda. Cobalah KALLYAS hari ini, dan rasakan perbedaan memiliki tema yang benar-benar komprehensif di sisi Anda!<br />
<br />
<h4 style="text-align: center;">
<u>Bronx - Theme Wordpress Toko Online</u></h4>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><img alt="Bronx - Theme Wordpress Toko Online" border="0" data-original-height="300" data-original-width="590" height="323" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjmHWnwTwaECSmhOOwxt4vNZ9CzdUQ3lyaHWBqX68Ptu3YK1039CeIlbWLtawTN0EMLiQPaRFVwp0eG-gy3NGP3eJo7lWEbP5pAtIphaI82xPKfvJ-xhyKqhEyqv-BsCoHiVqSvDjty62oI/s640/Bronx+-+Theme+Wordpress+Toko+Online.jpg" style="margin-left: auto; margin-right: auto;" title="Bronx - Theme Wordpress Toko Online" width="640" /></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Bronx - Theme Wordpress Toko Online</td></tr>
</tbody></table>
<br />
Bronx adalah tema WooCommerce yang bersih dan sederhana yang dapat Anda gunakan untuk membangun situs eCommerce yang mencolok yang pasti akan menarik lebih banyak pelanggan ke bisnis Anda. Dengan tata letak dan alat dan pilihan tema yang tak terhitung jumlahnya, Anda mendapatkan kemungkinan desain tak terbatas untuk toko online Anda. Hal ini sangat responsif terhadap berbagai jenis perangkat seperti desktop, tablet atau ponsel. Bronx cepat untuk menginstal dan menyesuaikan. Tema ini memungkinkan pemilik situs untuk memperluas halaman produk mereka sehingga mereka dapat secara efektif menampilkan fitur produk mereka dan mengundang lebih banyak pelanggan potensial untuk memeriksa dan membeli produk mereka. Bergantung pada kebutuhan bisnis Anda, Anda dapat memilih dua tata letak halaman produk yang berbeda.<br />
<br />
Komposer Visual yang terintegrasi dalam tema ini membuat halaman web dan halaman produk yang unik menjadi mudah. Komposer Visual adalah plugin drag and drop frontend dan backend page builder yang membuat pengembangan web menjadi lebih cepat dan mudah. Membuat kesan kepada target pelanggan Anda mudah karena tema ini mencakup plugin Slider Revolution yang memungkinkan Anda membuat tata letak beranda yang responsif dan eye-catching. Bronx juga hadir dengan beberapa pilihan header, Anda bisa mengatur header dengan latar belakang, header tanpa latar belakang, elemen navigasi atas yang user-friendly atau header tetap. Yang terpenting, Bronx kompatibel dengan WooCommerce untuk membantu Anda menyiapkan toko online yang layak untuk bisnis Anda. Dengan pilihan blognya yang mengagumkan, sekarang Anda bisa blog dengan gaya. Cukup pilih antara pasangan bata dan tata letak blog klasik. Selain itu, sepenuhnya kompatibel dengan WPML sehingga Anda dapat menjual produk Anda ke seluruh dunia dalam mata uang apapun. Apakah Anda berencana untuk meluncurkan baris baru? Anda sekarang dapat memamerkannya dengan membuat Lookbooks yang dapat diedit tanpa kerumitan menggunakan Komposer Visual.<br />
<br />
<h4 style="text-align: center;">
<u>XStore - Template WordPress Toko Online</u></h4>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-VaB-5fWXUNIZ1XNhM9O7c89VhvnpRXrPqLf53XoxIGsS9dlQLklmOwdW8ICwRz9s6dyZCWTXZGv5s7twM2Ybh7T-beR9V_AK9dya1i90CzagGPzodeI6Eu-H6cD2xnH3SvzSspv5OTSk/s1600/XStore+-+Template+WordPress+Toko+Online.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="XStore - Template WordPress Toko Online" border="0" data-original-height="300" data-original-width="590" height="324" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-VaB-5fWXUNIZ1XNhM9O7c89VhvnpRXrPqLf53XoxIGsS9dlQLklmOwdW8ICwRz9s6dyZCWTXZGv5s7twM2Ybh7T-beR9V_AK9dya1i90CzagGPzodeI6Eu-H6cD2xnH3SvzSspv5OTSk/s640/XStore+-+Template+WordPress+Toko+Online.jpg" title="XStore - Template WordPress Toko Online" width="640" /></a></div>
<br />
XStore adalah tema situs WooCommerce WordPress yang serbaguna dan kreatif, menarik secara visual dan sangat mudah digunakan, cerdas dan fleksibel, mudah responsif. XStore telah dikembangkan sebagai solusi multi-talented, polyfacetic dan sangat mudah beradaptasi untuk para webmaster dari latar belakang dan tingkat pengalaman yang ingin menciptakan situs toko online, digital, dan online yang kompeten, gerai digital, situs grosir online atau usaha e-Niaga apa pun yang bisa dibayangkan. . XStore ada sehingga Anda dapat dengan cepat dan efisien membuat situs web e-Niaga yang hebat di semua relung dan pasar dalam hitungan menit, tanpa harus menulis baris kode.<br />
<br />
Untuk itu, XStore telah dilengkapi dengan ensamble yang luar biasa dari situs demo dan template halaman yang terawat dengan sangat indah, dipatenkan dan dipoles dengan rapi, yang dapat Anda impor dengan mudah satu klik dan disesuaikan melalui Komposer Visual atau dengan Revolusi Slider atau Formulir Kontak 7 Plugin, ditambah banyak widget dan shortcode yang ditujukan khusus untuk perdagangan online dan usaha komersial. XStore telah dirancang dengan sengaja untuk menjadi serbaguna dan ringan, dengan kode bootstrap modular yang mendasari pondasi HTML5 dan CSS3 yang membuat keajaiban WooCommerce ini jadi tajam dan inovatif, dengan transisi dan animasi yang berani, penanganan video streaming yang asli dan banyak lagi. Coba XStore sekarang!<br />
<br />
<h3>
<br />Kumpulan Wordpress Themes Toko Online Terbaru Gratis (Free Download)</h3>
Setelah menampilkan yang premium, dibawah ini adalah daftar yang telah kami kumpulkan dari template wordpress toko online yang merupakan pilihan terbaik dan tentunya gratis, bisa digunakan sesuai dengan kebutuhan dari toko online yang sederhana hingga situs web wordpress yang serbaguna. Semoga anda menemukan jenis template gratis untuk web online shop anda, dan tentunya bisa memenuhi kebutuhan penjualan online yang sukses!<div style="text-align: center;">
<u><br /></u></div>
<h4 style="text-align: center;">
<u>Azera Shop Luxury - Template Wordpress Toko Online Gratis</u></h4>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><img alt="Azera Shop Luxury - Template Wordpress Toko Online Gratis" border="0" data-original-height="401" data-original-width="941" height="272" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgZsvWA2PCX6JofxBL32FE5uJolGkdIrk8ob9j4SMeKg7wXMqBQneOzwUFSammnBpmR7O49zQwl-72E9nSdnkY7lAqCMPXYrMVQ9y9AjcTUaRNOxpvhZQJ4flkedKlZOFKV7xAqkhMFwrrP/s640/Azera+Shop+Luxury+-+Template+Wordpress+Toko+Online+Gratis.png" style="margin-left: auto; margin-right: auto;" title="Azera Shop Luxury - Template Wordpress Toko Online Gratis" width="640" /></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Azera Shop Luxury - Template Wordpress Toko Online Gratis</td></tr>
</tbody></table>
Azera Shop Luxury adalah tema WordPress WooCommerce yang elegan dan gratis, cocok untuk membangun satu halaman toko online. Azera Shop Luxury adalah e-commerce (Woo Commerce) Kompatibel, WPML, RTL, Photo Gallery Grid, Formulir Kontak 7, Meta Slider, SiteOrigin Page Builder, SEO Friendly dan dengan efek paralaks, gambar layar penuh adalah salah satu tema e-commerce terbaik dan Alternatif etalase yang bagus Desain datar dan sederhana berdasarkan template bootstrap dapat bekerja dengan baik untuk setiap bisnis / startup, blog atau toko perhiasan atau situs fotografi.<br />
<br />
Demo Template: https://demo.themeisle.com/azera-shop-luxury/<br />
Download Template: https://themeisle.com/themes/azera-shop-luxury/<br />
<br />
<h4 style="text-align: center;">
<u>eStore - WordPress Themes Toko Online Gratis</u></h4>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiuXd_InKC7Oo8rD2Ot-SZDSZYoKRAUgHdDurNLFFDz7HCDXjGBBuU-aGj6PSnfym2oDx4EhccszpnFwofg9uXBfcWAsirTBCF3FYiriR8MZyRqm6MLEQ7k3-DGpVBJfwUPj7KCNQV7s3XQ/s1600/eStore+-+WordPress+Themes+Toko+Online+Gratis.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="eStore - WordPress Themes Toko Online Gratis" border="0" data-original-height="395" data-original-width="931" height="270" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiuXd_InKC7Oo8rD2Ot-SZDSZYoKRAUgHdDurNLFFDz7HCDXjGBBuU-aGj6PSnfym2oDx4EhccszpnFwofg9uXBfcWAsirTBCF3FYiriR8MZyRqm6MLEQ7k3-DGpVBJfwUPj7KCNQV7s3XQ/s640/eStore+-+WordPress+Themes+Toko+Online+Gratis.png" title="eStore - WordPress Themes Toko Online Gratis" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">eStore - WordPress Themes Toko Online Gratis</td></tr>
</tbody></table>
EStore adalah tema WooCommerce WordPress yang bersih, cantik dan dapat disesuaikan sepenuhnya. Tema ini berisi banyak fitur premium dan beberapa widget khusus yang membantu membuat toko online Anda profesional dan terorganisir dengan baik. Tema ini sepenuhnya kompatibel dengan plugin WooCommerce dan YITH WooCommerce Wishlist. Sebagai pemilik toko online, menarik pelanggan dan menjual produk akan jauh lebih mudah dengan tema ini.<br />
<br />
Demo Template: https://demo.themegrill.com/estore/<br />
Download Template: https://downloads.wordpress.org/theme/estore.zip<br />
<h4>
<div style="text-align: center;">
<span style="text-decoration-line: underline;"><br /></span></div>
</h4>
<h4 style="text-align: center;">
<u>WP Store - Template Wordpress Toko Online Free Download</u></h4>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><img alt="WP Store - Template Wordpress Toko Online Free Download" border="0" data-original-height="392" data-original-width="940" height="266" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVyKeC-gGK6oHX6fU3-9JAFCCsvVzAo36bh_axdT3LnPem_3kQmgzHwusao1cONw5lfZd7TdpmQNHkpe_0j61zeLB5u9BINS9QtskSLmhxgek9C9dVUV5aI4v13rdWVdumzloKVhJaDvO1/s640/WP+Store+-+Template+Wordpress+Toko+Online+Free+Download.png" style="margin-left: auto; margin-right: auto;" title="WP Store - Template Wordpress Toko Online Free Download" width="640" /></td></tr>
<tr><td class="tr-caption" style="text-align: center;">WP Store - Template Wordpress Toko Online Free Download</td></tr>
</tbody></table>
<div class="separator" style="clear: both; text-align: center;">
</div>
<br />
Toko WP adalah fitur woocommerce yang kaya fitur yang dibuat dengan indah untuk memberikan pengalaman e-commerce terbaik dalam desain sederhana yang nyaman untuk setiap jenis pengguna. Ini bisa digunakan untuk membangun segala jenis toko e-commerce / belanja. Ini benar-benar responsif dengan desain yang bersih. Customizer juga mudah digunakan.<br />
<br />
<h4>
Tentang Daftar Template Wordpress Toko Online Ini</h4>
Jika Anda tidak dapat menemukan tema yang tepat untuk Anda dalam kumpulan template premium diatas, mungkin Anda bisa dengan memulai menggunakan tema toko online gratis terlebih dahulu. Yang pertama mencantumkan tema online shop premium terbaik dan yang kedua adalah tentang tema online shop gratisan yang tersedia untuk penggunaan pribadi dan komersial. Sesuai dengan kebutuhan anda !</div>
</div>
Unknownnoreply@blogger.com3tag:blogger.com,1999:blog-997877103022851878.post-67128960551520525852017-06-16T00:20:00.002+07:002017-06-16T00:46:16.213+07:00Cara (Lengkap) Download dan Instalasi XAMPP di Windows,Linux Serta Mac os<div class="separator" style="clear: both; text-align: center;">
</div>
<b>Apa itu xampp?</b> Dikutip dari situs resminya di apachefriends.org bahwa XAMPP merupakan alat pengembangan PHP yang paling populer saat ini. XAMPP sepenuhnya gratis dan benar-benar bebas, dengan cara instal yang sangat mudah bahkan oleh pemula, 1 langkah instalasi untuk mengaktifkan Apache yang berisi MariaDB, PHP, dan Perl. Paket open source XAMPP dirancang agar mudah untuk dipasang dan digunakan di komputer anda.<br />
<br />
Dalam Tutorial ini kita akan belajar :<br />
<ul>
<li>Mengenal Apa itu Xampp dan Fungsinya</li>
<li>Cara Download Xampp di apachefriends.org</li>
<li>Instalasi Xampp di Windows</li>
<li>Instalasi Xampp di Linux Ubuntu</li>
<li>Instalasi Xampp di Mac OS X</li>
</ul>
<div>
<br /></div>
<h3>
XAMPP sebagai Paket Web Server LocalHost</h3>
<div class="separator" style="clear: both; text-align: left;">
<img alt="Download dan Instal XAMPP" border="0" data-original-height="549" data-original-width="1600" height="109" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEii76aff0GbviVKPtK7QfWi3293hMg3j8kR_nx5_mDbP9MGZFc5oSwvBKG1kl9n4Bi0gmsBQghkzb4z8cTYTt6jTF_q1ylIgDNwy6tdEHoutVg6CVKsux8hK3L51lwVllirtQM6f0FSMfZI/s320/XAMPP.jpg" title="Download dan Instal XAMPP" width="320" /></div>
XAMPP produksi dari pengembang apachefriends.org ini adalah paket aplikasi yang mem-bundle software-software yang dibutuhkan dalam hal pemograman web. X-A-M-P-P disiingkat dari huruf:<br />
<ul>
<li><b>X </b>: Huruf X berarti cross-platform, dimana aplikasi XAMPP tersedia untuk banyak Sistem Operasi</li>
<li><b>A</b> : A berarti Apache web server</li>
<li><b>M </b>: M berarti MySQL</li>
<li><b>P</b> : P berarti PHP</li>
<li><b>P</b> : P berarti Perl)</li>
</ul>
<b>Apakah XAMPP adalah web server</b>? jawabannya "xampp bukan web server". Karna xampp hanya bundle (Webserver+PHP+MySQL) yang memudahkan dalam instalasi webserver. Oh ya Selain XAMPP, sebenarnya ada banyak aplikasi lain yang juga mengpaketkan seperti ini misalnya seperti WAMPserver, AMPPS, dan masih banyak lagi.<br />
<div>
<br /></div>
<div>
Jadi dengan adanya xampp ini akan memudahkan kita yang kesulitan saat menginstal web server secara manual seperti yang pernah saya tulis pada artikel sebelumnya tentang <a href="http://blog.fispol.com/2017/05/panduan-lengkap-instalasi-php-apache.html" target="_blank">Cara instalasi apache, php, mysql di windows</a> dan <a href="http://blog.fispol.com/2017/06/tutorial-instal-apache-php-mysql-linux-ubuntu.html" target="_blank">tutorial instal apache,php,mysql di linux ubuntu</a>. Jadi jika anda telah berhasil menginstal webserver secara manual maka tidak perlu lagi menginstal xampp ini pada komputer anda.</div>
<div>
<br />
<h4>
Bagaimana cara kerja Xampp?</h4>
<div>
Memiliki server localhost menjadi satu alternatif bagi mereka yang ingin membuat website atau mengembangkan aplikasi berbasis web tapi tidak memiliki domain dan hosting yang terhubung dengan internet. Cara ini akan menjadi sangat efektif dilingkungan pengebangan aplikasi web, makanya seringkali dipraktikkan oleh para pengembang (web developer) amatir hingga profesional. Dengan cara ini mereka akan membuat aplikasinya dikomputer local terlebih dahulu dan setelah selesai barulah kemudian meng-uploadnya ke web server internet (hosting) agar bisa diakses secara global diseluruh dunia.</div>
<div>
<br />
Sederhananya adalah Xammp akan menginstal aweb server lokal dikomputer kita. Dan dalam hal ini web server yang dipaketkan bersama dengannya yaitu apache http web server. Adapun bundle (Paket) dari Xampp, antara lain:<br />
<ul>
<li>Apache</li>
<li>MySQL</li>
<li>PHP (<a href="http://blog.fispol.com/2017/06/apa-definisi-fungsi-PHP-bahasa-pemograman.html" target="_blank">apa itu php?</a>)</li>
<li>phpMyAdmin</li>
<li>FileZilla FTP Server</li>
<li>Tomcat</li>
<li>XAMPP Control Panel</li>
</ul>
<div>
<br /></div>
<h3>
DOWNLOAD XAMPP INSTALLER</h3>
</div>
<div>
Untuk dapat menggunakan XAMPP, kita harus mendownloadnya di situs resmi XAMPP: <a href="https://www.apachefriends.org/" rel="nofollow" target="_blank">https://www.apachefriends.org</a>. Silahkan buka situs tersebut, kemudian klik pada tombol XAMPP for Windows v5.6.3 (PHP 5.6.3). Penamaan baru XAMPP ini mengikuti versi PHP yang ada di dalam paket tersebut.<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><img alt="Cara Download dan Instalasi XAMPP" border="0" data-original-height="538" data-original-width="991" height="347" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEguqDXxiDgvkOWw84o633fbhvJWB1R8coVEz4gGg51F86l9c6dovGop_J1AcarRGUT6z-XAbTPE5HQXp8gzxnR2dSxyKBbWXgBHImkBUmQofcTJUKyUY9e0SFQfRyFVU5PPBKRLptHjJ0x_/s640/XAMPP.png" style="margin-left: auto; margin-right: auto;" title="Cara Download dan Instalasi XAMPP" width="640" /></td></tr>
<tr><td class="tr-caption" style="font-size: 12.8px;">Apachefriends.org : Download XAMPP sesuai Sistem Operasi Komputer Anda<br />
<div>
<br /></div>
</td></tr>
</tbody></table>
Sesuaikan dengan sistem operasi dari komputer yang akan kita instalkan xampp, misalkan jika tidak ada perubahan maka:<br />
<br />
<ul>
<li>Download xampp Windows di <span style="font-family: "courier new" , "courier" , monospace;">https://www.apachefriends.org/xampp-files/5.6.30/xampp-win32-5.6.30-1-VC11-installer.exe</span></li>
<li>Download xampp Linux di <span style="font-family: "courier new" , "courier" , monospace;">https://www.apachefriends.org/xampp-files/5.6.30/xampp-linux-x64-5.6.30-1-installer.run</span></li>
<li>Download xampp MAC OS-x di <span style="font-family: "courier new" , "courier" , monospace;">https://www.apachefriends.org/xampp-files/5.6.30/xampp-osx-5.6.30-1-installer.dmg</span></li>
</ul>
<br />
Mungkin saja versi XAMPP yang anda gunakan akan lebih baru dari ini, tetapi umumnya cara menginstall aplikasi ini akan tetap sama. File XAMPP berukuran cukup besar, Savelah file ini di dalam komputer anda.<br />
<br />
Catatan: Sangat tidak disarankan untuk mendownload xampp diluar situs resmi pengembangnya yaitu apachefriends.org.<br />
<br />
<h3>
<u>
Panduan Lengkap Instalasi XAMPP di Komputer</u></h3>
Nah tidak perlu berlama-lama setalah Anda berhasil mendapatkan aplikasi Xampp dan telah tersimpan pada komputer, maka bisa menggunakannya adalah melakukan instalasi. Berikut adalah cara instal aplikasi xampp sesuai dengan sistem operasi komputer yang dijalankan.<br />
<br />
<h4>
(1) INSTAL XAMPP WINDOWS</h4>
<ul>
<li>Pertama, pastikan download xampp intaller untuk windows sudah berhasil tersimpan dikomputer.</li>
<li>Doble klik (klik 2x) file installer XAMPP yang baru saja download dan disimpan pada windows, kemudian selanjutnya akan muncul jendela “Bahasa Installer” kurang lebih seperti gambar dibawah:</li>
<div class="separator" style="clear: both; text-align: center;">
<img alt="xampp windows installer" border="0" data-original-height="165" data-original-width="303" height="347" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiLgOzqwMhLaFs16OFS_BPgsJ3Qz1uABiLV3IrcSM-TwRMrnbtkJO5AG0W729sA-HPzsDdyQwkywsFQGOyAA3kBTO0BDRmkU6mMNvE7xG9uqD4MFxfpx7so1hu6F7QPYTqYXXjBQ95vNpp8/s640/xampp+windows+installer.png" title="xampp windows installer" width="640" /></div>
<ul>
<li>lalu pilihlah bahasa xampp yang anda inginkan diinstal pada windows</li>
<li>Klik "OK" untuk melanjutkan</li>
</ul>
<li>Langkah selanjutnya adalah akan muncul jendela pop up yang menyrankan untuk untuk menutup beberapa aplikasi lain yang sedang aktif. Nah, setelah aplikasi yang diarasa memberatkan tertutup semua, pilih "NEXT" untuk melanjutkan prosesnya.</li>
<li>Pada tahap berikutnya, adalah memilih aplikasi yang akan diinstalkan bersamaan dengan paket Xampp windows ini. </li>
<div class="separator" style="clear: both; text-align: center;">
<img alt="Xampp Windows - Aplikasi yang mau diinstal" border="0" data-original-height="292" data-original-width="376" height="496" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEguiRaYfgh4Xtf_XZi3q1Gn9lPjCEAaVSRrqSIC85LJmNY248ooz7dg3DzofinKjVfXus5iMgXVLB7feyIsIyFd8Qs3kXsoQWiR_62wPwbiKqikdpCDm1KDw_cKCirwslip5nLdS0nrK08I/s640/Intsal+Xammp+Windows+Konfigurasi.png" title="Xampp Windows - Aplikasi yang mau diinstal" width="640" /></div>
<ul>
<li>Jika Anda tidak paham, maka pilihlah untuk memilih semua (centang) pilihan yang tersedia.</li>
<li>Untuk melanjutkan klik tombol Next.</li>
</ul>
<li>Selanjutnya adalah untuk menentukan lokasi file aplikasi, sebagai folder penyimpanan untuk berkas-berkas aplikasi XAMPP. Secara dasar akan diarahkan ke lokasi <span style="font-family: "courier new" , "courier" , monospace;">c:\xampp</span>. Namun anda bisa merubahnya ke alamat berbeda jika Anda ingin menyimpannya di folder lainnya, anda bisa memilih browse dan menentukan folder lainnya yang ingin digunakan sebagai tempat penyimpanan file xampp.</li>
<li>Setelah selesai dengan pemilihan folder xampp, lanjutkan dan meng-klik tombol Install.</li>
<li>Nah pada langkah ini, xampp akan mengurai paketnya dan ini berlangsung dalam beberapa saat, jadi tunggulah beberapa menit hingga proses instalasi xampp ini benar2 telah selesai. Jika sudah muncul jendela seperti di bawah ini:</li>
<div class="separator" style="clear: both; text-align: center;">
<img alt="Xampp Windows - Instalasi Berhasil" border="0" data-original-height="293" data-original-width="381" height="492" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg1-pX_YdYpqlUIbyrp0F6IjPz2NqGx_9lticAZoBHmO5CzgawvgCMicEM60uCrKtjvOxf2kkoOtzfdY2zNGaiEn47iIX_KkD_JQhmHXgHzPOyf-joePT93fD_VI_418S4C45ldupUgb0HI/s640/Xampp+Windows+-+Instalasi+Berhasil.png" title="Xampp Windows - Instalasi Berhasil" width="640" /></div>
<ul>
<li>Proses instalasi xampp Windows telah berhasil !</li>
<li>Lalu Klik tombol Finish.</li>
</ul>
<li>Untuk menjalankan aplikasi XAMPP windows (Jika tidak terbuka otomatis saat instalasi diselesaikan) maka bisa dengan mengakses pada Windows Start Menu atau Desktop, dan klik pada icon XAMPP.</li>
</ul>
<div>
<br /></div>
</div>
<div>
<h4>
(2) INSTAL XAMPP LINUX UBUNTU</h4>
Setelah berhasil di windows maka selanjutnya kita beralih ke Linux, berikut adalah cara mudah instalasi XAMPP pada komputer dengan sistem operasi LINUX UBUNTU.<br />
<ul>
<li>Pastikan anda telah berhasil mendownload software installer XAMPP untuk linux pada link diatas. </li>
<li>Buka terminal atau akses mudah dengan Ctrl + Alt + T, pindah ke direktori installer XAMPP. Untuk membuat instalasi lebih mudah bisa juga dengan meletakkan installer XAMPP Linux di folder Home. </li>
<ul>
<li>Tambahkan permission execute untuk installernya : <span style="font-family: "courier new" , "courier" , monospace;">chmod +x xampp-linux-***-installer.run</span></li>
<li>Atau <span style="font-family: "courier new" , "courier" , monospace;">chmod 755 xampp-linux-***-installer.run</span></li>
<li>Ganti <span style="font-family: "courier new" , "courier" , monospace;">***</span> disesuaikan dengan versi Xampp yang digunakan</li>
</ul>
<li>Jalankan Installer</li>
<ul>
<li>Jalankan dengan perintah: <span style="font-family: "courier new" , "courier" , monospace;">sudo ./xampp-linux-***-installer.run</span></li>
<li>Ganti <span style="font-family: "courier new" , "courier" , monospace;">***</span> disesuaikan dengan versi Xampp yang digunakan</li>
<li>Biarkan proses instalasi sampai berhasil.</li>
</ul>
<li>Sedangkan untuk menjalankan XAMPP di linux, via command line dengan memasukkan <span style="font-family: "courier new" , "courier" , monospace;">sudo /opt/lampp/lampp start</span>.</li>
</ul>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><img alt="Instalasi Xampp di Linux Ubuntu" border="0" data-original-height="584" data-original-width="1107" height="210" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi6bFLdobMeRVa9I3kBYO69kAC02BmZLRJIvOPNbNd0irQvVQ9BeoPzvX-Z5qHEUdhXrqaPOOF5dCMPxuNMAVUsRvX9ZVGXFXhzDWjEjkCga_O4XK2z4AL6k47SpYll73aIbWlSiuFgeF-v/s400/instalasi+xampp+linux+selesai.png" style="margin-left: auto; margin-right: auto;" title="Instalasi Xampp di Linux Ubuntu" width="400" /></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Instalasi Xampp di Linux Ubuntu</td></tr>
</tbody></table>
</div>
<div>
<br />
<h4>
(3) INSTAL XAMPP MAC OS-X</h4>
Windows dan Linux sudah selesai diinstal, dan terkahir adalah pada sistem Operasi MAC OS X. Mungkin ini adalah tutorial paling ditunggu sebab saya belum menyertakan manual instalasi khusus MAC os sebelumnya, yang ada hanya linux dan ubuntu saja ya kan? Baiklah, berikut adalah langkah-langkah untuk menginstal Xampp pada komputer MAc OS ox.<br />
<br />
<ul>
<li>Pertama untuk komputer mac, pastikan sudah mendownload installer xampp for OS X pada link diatas sebelumnya, dengan men-download file installer .dmg dan telah tersimpan. Ukuran filenya installer xampp ini tiak terlalu besar hanya sekitar 137MB saja.</li>
<li>Saya anggap intaller xampp sudah terdownload, kita lanjutkan dengan menjalankan instalasinya dengan mengklik pada file tersebut. </li>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><img alt="Installer Xampp mac os-x" border="0" data-original-height="180" data-original-width="270" height="266" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi2YohY06eYzQeTQWMM8JT3NbHxl4gWoaqDVEQzrUqkWNdrAAgIUE8ZxvM37rjxLRpcUme9mq80k2FFhcnw9fJ7TTd4j5Kn4wZXNk7CKqNOgU0WKcYnMJNuXPXa7PQxVI1k6Vy17Ox3wQFS/s400/Installe+Xampp+mac+os-x.jpg" style="margin-left: auto; margin-right: auto;" title="Installer Xampp mac os-x" width="400" /></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Installer Xampp mac os-x</td></tr>
</tbody></table>
<li>Akan tampil jendela instalasi dia awal, kita bisa mulai dengan klik xampp.</li>
<li>Seperti instalasi biasanya pada mac os akan meminta verifikasi dari administrator untuk melakukan instalasi, untuk melanjutkan pilih "OPEN". Dan meminta password komputer yang dipasang, masukan password yang diminta.</li>
<li>Jika verifikasi berhasil, maka klik "NEXT" untuk memulai proses instalasi xampp max os.</li>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><img alt="Mulai proses instalasi xampp mac os" border="0" data-original-height="161" data-original-width="197" height="260" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiNMcuXcPPaQYZzvCB5lQvORuPDhA0dxXP-vVgHZdrhr0iuukCXa-b-q_eV5Tnlzms96budf-oRiYIe4VFd0vO-ct8rnsoBLiMruanjWDPAvXP1TOdLZH6bWIjxAIwKaamNPKLxatrsY7MJ/s320/Mulai+proses+instalasi+xampp+mac+os.jpg" style="margin-left: auto; margin-right: auto;" title="Mulai proses instalasi xampp mac os" width="320" /></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Mulai proses instalasi xampp mac os</td></tr>
</tbody></table>
<ul>
<li>Saya pikir tidak ada option lagi, jadi untuk selanjutnya mealnjutkan dengan mengklik tombol "NEXT" dan "NEXT" saja hingga terlihat proses instalasi paket xamp terlihat.</li>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td><img alt="Proses xampp mac os sedang berjalan" border="0" data-original-height="401" data-original-width="492" height="325" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiiejKlBACcFViPRC0___fhM8k3oQsocNKSZYyaeSpc2wXuchyphenhyphennUq4hejSNEcaPkQ9BpNHbTfvUVrlE8Bw3X6ZQ8mylAhm_SfyOuoS42z152hy9W5M5dBUZHRpVNjIQREIEvBMwNDX7pQTS/s400/Proses+xampp+mac+os+sedang+berjalan.jpg" style="margin-left: auto; margin-right: auto;" title="Proses xampp mac os sedang berjalan" width="400" /></td></tr>
<tr><td class="tr-caption" style="font-size: 12.8px;">Proses xampp mac os sedang berjalan</td></tr>
</tbody></table>
<ul></ul>
</ul>
<li>Tunggu hingga proses intalasi benar-benar selesai lalu next.</li>
<li>Setelah instal xampp berhasil, agar fungsi xampp dan webserver dapat diaktifkan maka sistem pada mac os akan meminta persetujuan untuk mengaktifkan aplikasi webserver. Untuk mengizinkan klik allow/setujui.</li>
<li>Nah jika tidak ada kesalahan atau masalah maka selesailah proses instalasi xampp. Anda akan melihat kontrol panel seperti gambar dibawah ini. </li>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><img alt="Control Panel Xampp pada Mac Os x" border="0" data-original-height="472" data-original-width="663" height="283" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7z5URoQdGwE7KzFKjFvgQ-aiV8Bw1y472gVaPVpPVOwlTH5H0bs3ygdBT3rHbDnW_4y7x_c2C_FgcX15cvfvk0s3oK0i26hsE16_dv5VKZ00o3-wLzC2hz0HuioL3h3D4xXAUkGXCKkLv/s400/Control+Xampp+di+Mac+Os.jpg" style="margin-left: auto; margin-right: auto;" title="Control Panel Xampp pada Mac Os x" width="400" /></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Control Panel Xampp pada Mac Os x</td></tr>
</tbody></table>
<li>Untuk menguji apakah web server sudah aktif, bisa dengan membuka browser misalnya safari dan ketikkan alamat <span style="font-family: "courier new" , "courier" , monospace;">http://localhost</span> pada addres bar lalu ENTER.</li>
</ul>
<div>
<br /></div>
<ul><ul><ul></ul>
</ul>
</ul>
<br />
<h4>
Kesalahan atau Error saat Instalasi Xampp</h4>
Selesai sudah proses instalasi XAMPP di berbagai sistem operasi komputer. Bahwa memang tidak terlalu sulit dalam hal menginstal aplikasi ini, baik untuk windows,linux maupun MAc os? hanya perlu mengunduh, lalu install, dan ikuti panduan instalasinya. </div>
<div>
<br /></div>
<div>
Namun semua tidak terlepas dari kesalahan yang bisa saja menyebabkan kegagalan yang bisa disebabkan oleh beberapa hal yang belum kita ketahui. Jika anda mengalami masalah dalam menginstal xampp di komputer anda. Silahkan share di kotak komentar...</div>
<div>
<br /></div>
<div>
Oh ya pada artikel dikemudian hari kita akan belajar bagaimana cara mencustom domain localhost supaya poyek kita bisa diakses tanpa http://localhost/folder saja tapi bisa juga dengan custom domain khusus misalnya www.proyekweblocal.com... Sampai juga !!!</div>
</div>
Unknownnoreply@blogger.com3tag:blogger.com,1999:blog-997877103022851878.post-3349772898248483672017-06-14T10:22:00.000+07:002017-06-14T10:22:20.318+07:00Mengenal Definisi dan Fungsi PHP sebagai Bahasa Pemrograman Web<div>
<div>
<b>Apa itu PHP </b>? Mengapa saya menulis ini adalah sebagai pelengkap dari tulisan dan tutorial yang membahas tentang PHP, siapa tahu aja pembaca merupakan pemula dan sedang mencari informasi untuk bisa lebih mengenal apa itu PHP dan fungsinya sebagai Bahasa Pemograman Web masa kini.<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><img border="0" data-original-height="648" data-original-width="1200" height="345" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgaqiZ_diNjCOQwwemLzo4RHvV8oN3vDotFLtjhcact_6g5GEOqfElKYYgJdaMr0KcJgJHj4tk_ZFCaqoq3K2164xD5RifFsk5AVecXGbyzurVl-B4_5AdJHLIfaU4c41u_khzPQ68oQY_G/s640/PHP.png" style="margin-left: auto; margin-right: auto;" width="640" /></td></tr>
<tr><td class="tr-caption" style="text-align: center;">LOGO PHP.NET</td></tr>
</tbody></table>
</div>
<div>
<h4>
Defenisi dan Pengertian PHP (Hypertext Preprocessor)</h4>
Sejarah PHP dimulai pada tahun 1995 dimana bahasa pemograman web ini pertama kali dirancang oleh Rasmus Lerdorf dan pada awalnya PHP merupakan kependekan dari Personal Home Page (atau Situs personal). Adapun wujud PHP dimasa itu masih berupa sekumpulan skrip yang digunakan untuk mengolah data formulir dari web yang disebut sebagai Form Interpreted (FI)<br />
<br />
<b>PHP</b>: Hypertext Preprocessor atau disingkat PHP adalah bahasa pemrograman script server-side yang pada hakikatnya dirancang untuk tujuan pengembangan pada web. Mengapa? karna PHP diproses pada komputer server. Jika kita belihat pada bahasa pemograman lain, misalkan JS (JavaScript) maka akan terlihat sangat berbeda dimana kode pada pemograman ini diproses oleh peramban web pengguna saja ( tidak pada Server). Dan selain itu Script PHP ini juga bisa digunakan sebagai bahasa pemrograman di khalayak umum.<br />
<br />
Pada tahun - tahun berikutnya, PHP telah menjadi menjadi bahasa pemrograman web yang kuat dan tidak hanya digunakan untuk membuat halaman web sederhana seperti terdahulu, hingga saat ini php terus berkembangan dan menjadi sangat populer sebagai bahasa pemrograman web. Misalnya saja yang tekenal saat ini yaitu Facebook, perpustakaan wikipedia, Cms wordpress, Cms joomla adalah dibuat menggunakan PHP.<br />
<br />
<h4>
Mengapa PHP diunggulkan?</h4>
<u>PHP itu Gratis</u> dan Bisa digunakan oleh siapapun karna berlabel Open Source. Karna PHP telah dirilis dalam lisensi PHP License yang tentunya memang berbeda dengan lisensi GNU General Public License (GPL) yang biasanya digunakan untuk proyek Open Source.<br />
<br />
<u>Kemudahan Bahasa pemrograman PHP</u> yang saat ini menjadi popularitas telah menjadi standar bagi programmer web di seluruh dunia. Disebutkan oleh WIKIPEDIA bahwa pada bulan februari 2014 ada sekitar 82% dari web server yang tersebar didunia menggunakan bahasa pemrograman tersebut. Ini bisa kita saksikan saat ini dimana ada banyak program web yang dirancang dengan PHP. Contoh paling dekat adalah CMS (Content Management System) yang saat ini sedang hits yaitu Worpress.ORG.<br />
<br />
Pentingnya PHP Sebagai Bahasa pemrograman web masa kini didalam dunia perkembangan Teknologi Informasi dapat dibuktikan Berdasarkan analisa Mesin Pencari raksasa google pada bulan September tahun 2015 yang menyebutkan bahwa script PHP menjadi Runner up setelah bahasa pemrograman Java.<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><img alt="Perkembangan PHP dan Bahasa Pemrograman Lainnya" border="0" data-original-height="300" data-original-width="522" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhaTqQXiY-DbYLiY2nNEESTj38e8Z85U3hruDjZGIEdhzfTxpKeu_JSGuO-5w74r_3kAsv1P8KcmgX5RWCxXJmwir-jbGyK1ZpcZOYhPoaKyw7YpFqyRrDuKZ-sNdmecFJ8AcTBmptMQuD6/s1600/Perkembangan+PHP.png" style="margin-left: auto; margin-right: auto;" title="Perkembangan PHP dan Bahasa Pemrograman Lainnya" /></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Perkembangan PHP dan Bahasa Pemrograman Lainnya</td></tr>
</tbody></table>
<br />
Karena kemudahan yang ditawarkan PHp, saat ini banyak sistem informasi berbasis web yang dirancang dengan PHP sebagai bahasa pemrograman dasar untuk membuat website dengan konten dinamis. Dari pendapat yang sering terungkap bahwa bahasa program PHP ini merupakan bahasa scripting yang paling mudah karena referensi yang mudah ditemukan dan banyak tersebar di internet. Apalagi yang menariknya adalah PHP bersifat open source. Dalam penggunaan bahasa pemrograman ini produk Database yang menjadi sering digunakan bersama adalah MySQL yang kemudian dijalankan bersama webserver Apache.<br />
<br />
Apa kelebihan php jika dibandingakn dengan Bahasa pemrograman lainnya? Sekilas tentang kelebihan Bahasa pemrograman PHP dapat dijelaskan dibawah ini, merupakan pendapat terbuka dari pengalaman teman teman programer yang pernah saya tanyakan.<br />
<br />
<ul>
<li><b>PHP itu Open Source</b> yang dapat kita instal dan gunakan pada berbagai sistem operasi komputer misalnya Linux, Unix, Macintosh, bahkan Windows.</li>
<li><b>Didukukung Web Server</b> yang populer termasuk apache, IIS, Lighttpd, hingga Xitami dengan sangat mudah untuk dikonfigurasi.</li>
<li><b>PHP Sebagai bahasa pemrograman</b> yang tidak melakukan sebuah kompilasi dalam penggunaannya.</li>
<li><b>PHP Kaya Akan Referensi</b>, Bahasa pemrograman web yang paling mudah dipelajari oleh pemula sekalipun, ini karena PHP memiliki referensi yang banyak baik diforum-forum maupun buku-buku.</li>
<li><b>Komunitas Yang hidup</b> - Sebagai proyek Open Source akan ada developer yang siap membantu dalam pengembangan bahasa pemrograman PHP</li>
</ul>
<br />
<h4>
Instalasi PHP pada Windows dan Linux Ubuntu</h4>
Untuk penerapan PHP dalam berbagai sistem operasi komputer, kita dapat mendowload dan melakukan instalasi secara bebas. Saya menyarankan anda mendownload di situs resmi dari php di http://php.net/manual/en/install.php sedangkan Berikut adalah artikel terkait sebagai referensi untuk konfigurasinya:<br />
<br />
<ul>
<li><a href="http://blog.fispol.com/2017/05/panduan-lengkap-instalasi-php-apache.html" target="_blank">Instal Webserver dan PHP di Windows</a></li>
<li><a href="http://blog.fispol.com/2017/06/tutorial-instal-apache-php-mysql-linux-ubuntu.html" target="_blank">Instal Webserver dan PHP di Linux</a></li>
</ul>
<br />
<br />
<h3>
Contoh Penerapan PHP dalam Pemrograman Web</h3>
Terkait dengan hal bahasa pemrograman web atau website, PHP untuk mengolah data tidak terlepas dari dukungan dari bahasa pemrograman lainnya seperti script HTML, CSS, dan Javascript. Dengan kombinasi diantranya akan membuat sebuah web yang lebih menarik dan interaktif.<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><img alt="Skema pada penerapan php sebagai bahasa pemrograman" border="0" data-original-height="219" data-original-width="783" height="179" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiNOe92mcS_RSYTpZx6PG-21MAvGrFGJk8zSch5i2DYY5WoWSqCxOZilf5B88OSIPrHFUNuch-0inEzOQFJ9HrkUhTVO5GQ9HW0RNgTbw2o9xVFwRY1-mFJSIiFZthdSlgIBkAYgtlR2CSO/s640/PHP+SKEMA.JPG" style="margin-left: auto; margin-right: auto;" title="Skema pada penerapan php sebagai bahasa pemrograman" width="640" /></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Skema pada penerapan php sebagai bahasa pemrograman</td></tr>
</tbody></table>
<br />
Mengolah data adalah peranan yang sangat penting dari PHP dalam penerepannya pada pemrograman web. Untuk mengenal bagaimana penerapannya, berikut adalah contoh yang mungkin akan mendekatkan kita untuk lebih memahaminya:<br />
<blockquote class="tr_bq">
Pengguna (Website User) mengakses website dengan URL khusus yang kemudian browser mengirimkan permintaan HTTP request kepada Server web dengan membawa rpermintaan data. Kemudian, sebelum ditampilkan kepengguna, data yang dimaksud akan di proses terlebih dahulu oleh PHP untuk melakukan suatu perintah CRUD terhadap database server lalu sebagai bentuk jawaban dari server. Selanjutnya server kembali mengirimkan data yang di minta kepada web user untuk kemudian di tampilkan ke browser (peramban web).</blockquote>
<h4>
Apa yang dapat dilakukan dengan PHP ?</h4>
<div>
Nah dalam contoh yang sangat sederhana kita dapat menjelaskan apa saja yang bisa dilakukan dengan bahasa PHP dalam hubungan antara Server Web, Website, Data dan Pengguna:</div>
<br />
<ul>
<li>PHP mengelola File - Membuat (Create), membuka (Open), membaca (Read), menulis (Write), menghapus (Delete), serta menutup file (Closed) pada web server.</li>
<li>PHP Mengolah Data - Mengumpulkan Data formulir</li>
<li>PHP Mengelola Database - Menambah, menghapus, memodifikasi data dalam database Anda</li>
<li>PHP Mengontrol User - Mengontrol Akses Pengguna</li>
<li>PHP Mengelola Cookies - Mengirim dan menerima cookies</li>
<li>PHP Mengenkripsi data</li>
</ul>
<div>
<br /></div>
</div>
<h4>
Hubungan PHP dengan HTML, CSS, JavaScript</h4>
Seperti dijelaskan diatas bahwa dalam hal penerapan PHP sebagai bahasa pemrograman berkombinasi dengan bahasa pemrogaman lainnya seperti bahasa HTML, JavaScript dan lain sebainya.<br />
<br />
<b>Membuat File.PHP</b> - Apa itu PHP file? Kode atau script PHP dijalankan pada server web, dan hasilnya dikembalikan ke peramban pengguna (browser) dalam berbagai output misalnya adalah HTML yang pada umumnya paling sering diaplikasikan. Setiap File atau berkas dari PHP ini ber-ekstensi ".php". Misalnya: Index.php, Home.php, Conto.php, atau halaman.php.<br />
<br />
Jika anda menemukan berkas diserver dengan ekstensi seperti diatas maka file tersebut merukan script PHP. Sedangkan cara isi dari file php dapat dicontohkan dibawah ini.<br />
<br />
Buat sebuah file dangan nama contoh-skrip.php atau contoh-halaman php dan sebagai isinya tuliskan kode berikut:<br />
<blockquote class="tr_bq">
<span style="font-family: Courier New, Courier, monospace;"><?php<br />echo "Apa itu PHP?";<br />echo "inilah adalah contoh halaman yang di buat dengan bahasa pemograman php";<br />?></span></blockquote>
Nah dari contoh diatas jelas bahwa setiap kode dari php diawali dengan sintaks <span style="font-family: Courier New, Courier, monospace;"><?php</span> dan diakhiri dengan sintaks <span style="font-family: Courier New, Courier, monospace;">?> </span>sebagai penutup scriptnya. Yang artinya adalah PHP hanya akan mengeksekusi kode yang ditulis dalam pembatas sebagaimana ditentukan oleh dasar sintaks PHP itu sendiri. Sehingga jika ada kode yang ditulis di luar pembatas sintaks tersebut, maka tidak akan diproses. Tujuan utama dari pembatasan ini tidak lain adalah untuk memisahkannya dari perintah kode lainnya yang mungkin berkombinasin dalam satu file yang sama, misalnya saja HTML.<br />
<br />
<br />
<b>PHP, HTML, CSS dan Javascript</b><br />
<br />
Nah dengan demikian bahwa sebuah file php dapat berisikan banyak bahasa program yang dapat kita kombinasikan untuk membangun sebuah halaman dan begitupun sebaliknya. Seperti yang paling umum digunakan sebagai output standar dari script php adalah HTML. Dengan catatan untuk tidak melupakan sintaks pembuka dan penutup dari php beserta kode lainnya yang memiliki sintaks masing-masing. Dibawah ini adalah beberapa contoh untuk membantu kita memahami bagaimana kombinasi yang dimaksudkan:<br />
<br />
<b>Contoh Scrip PHP yang Berisi Kode HTML</b>, Buatlah sebuah file dengan nama <span style="font-family: Courier New, Courier, monospace;">html-dalam-php.php </span>dan dengan berisi kode dibawah ini<span style="font-family: Courier New, Courier, monospace;">:</span><br />
<br />
<blockquote class="tr_bq">
<br /><?php<br />// Contoh file php yang berisi HTML<br />echo '<html>';<br />echo '<body>';<br />echo '<center>';<br />echo 'Hallo semua, ini adalah contoh halaman php dengan output HTML';<br />echo '<center>';<br />echo '</body>';<br />echo '</html>';<br />?></blockquote>
<br />
<b>Contoh File HTML yang Berisi Kode PHP</b>, buatlah sebuah file misalnya bernama index.html atau contoh-php.html dan isi dengan kode dibawah ini:<br />
<br />
<blockquote class="tr_bq">
<html><br /><body><br /><h1>Apa itu PHP?</h1><br /><h2>PHP adalah bahasa pemrograman website</h2><br /><?php<br />echo "Defenisi php adalah...";<br />?><br /></body><br /></html></blockquote>
</div>
<div>
<br />
<h4>
Referensi lain tentang PHP</h4>
</div>
<div>
Bila anda masih sulit memahami ada banyak sumber referensi tersedia secara online baik itu mengenai fungsi, pengertian maupun definisi yang benar. Sumber dan Referensi terkait dengan Apa itu PHP dan Pengenalan PHP sebagai bahasa pemograman web :</div>
<div>
<ul>
<li>Situs resmi pengembang dan kominitas PHP di http://php.net</li>
<li>Perpustakaan online di https://id.wikipedia.org/wiki/PHP</li>
</ul>
<div>
<br /></div>
<div>
Demikianlah informasi sekilas mengenai PHP sebagai Bahasa Pemrograman Web, dimana artikel ini membawa kita untuk lebih mengenal apa itu php beserta contoh sederhana terhadap penerapan-penerapan dan hubungannya dengan bahasa pemograman lain.</div>
</div>
Unknownnoreply@blogger.com8tag:blogger.com,1999:blog-997877103022851878.post-76880252175218617552017-06-05T13:25:00.001+07:002017-06-25T12:04:47.803+07:00Tutorial Instal Apache, PHP dan MySQL Pada Komputer Linux<b>Cara Instal Apache, PHP dan MySQL di Linux</b> - Seperti yang saya janjikan minggu lalu bahwa setelah membahas <a href="http://blog.fispol.com/2017/05/panduan-lengkap-instalasi-php-apache.html" target="_blank">cara instal Apache, PHP, MySQL di Windows</a> maka kali ini kita akan mencoba untuk menginstal alat pengembangan ini pada sistem operasi berbeda. Artikel kali ini khusus ditunjukkan pada anda yang menggunakan <b>Linux</b> sebagai Sistem operasi komputer dalam belajar pemograman.<br />
<a name='more'></a><br />
<br />
Dalam artikel ini kita akan belajar tutorial tentang:<br />
<br />
<ul>
<li>Cara instal PHP 7.0 di OS LINUX</li>
<li>Cara Menginstal dan Aktifasi Apache,PHP,Mysql di Linux Ubuntu</li>
<li>Cara instalasi php dan Mysql tanpa menggunakan Xampp atau Wamp</li>
</ul>
<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgme64garGCjWEt4v_0hA5QCvuMlcjKRnchdl4Q9Y7IM2Fk0PSoEfmmlikQ3V8PyI7hyphenhyphen3YnGww_JxwqLil5-j43ONkQv1hSPgTdH2ZEY3AHEJtreTsCkCqPdsFIZ0WzhjUQwBDCm_Qxiz5B/s1600/Apache+PHP+MySQL+di+LINUX.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="Apache PHP MySQL di LINUX" border="0" data-original-height="135" data-original-width="530" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgme64garGCjWEt4v_0hA5QCvuMlcjKRnchdl4Q9Y7IM2Fk0PSoEfmmlikQ3V8PyI7hyphenhyphen3YnGww_JxwqLil5-j43ONkQv1hSPgTdH2ZEY3AHEJtreTsCkCqPdsFIZ0WzhjUQwBDCm_Qxiz5B/s1600/Apache+PHP+MySQL+di+LINUX.jpg" title="Apache PHP MySQL di LINUX" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Apache PHP MySQL di LINUX</td></tr>
</tbody></table>
<br />
<blockquote class="tr_bq">
Meskipun materi artikel yang akan dijelaskan ini akan kita praktekkan menggunakan Ubuntu <span style="background-color: #999999; color: white;">14.04</span>, tapi saya pikir sama saja dengan cara pada ubuntu dengan versi yang lebih baru yakni V.15.04 dan V.15.10.</blockquote>
Nah pada tutorial ini, adapun metode proses instalasinya akan kita manfaatkan perintah <span style="background-color: red; color: white; font-family: "courier new" , "courier" , monospace;">apt-get instal</span> yang dapat kita lakukan secara online. Jadi tentu saja koneksi internet akan diperlukan untuk dapat melakukan instalasi di linux kali ini. Kita juga akan sedikit bergeser langkah dimana pada tutorial sebelumnya dimulai dengan PHP lebih dulu, maka pada cara instalasi di Linux ini yang paling pertama kita instal adalah Apache, kemudian PHP lalu MySQL.<br />
<br />
<h4>
Instal Apache di Linux Ubuntu V.14.04</h4>
Dari sekian banyak pilihan software yang mungkin tersedia untuk dijadikan sebagai server HTTP pada OS Linux ini, Apache adalah pilihan terbaik saat ini oleh karena itu kita akan langsung melakukan praktek instalasinya tanpa bertele-tele. Berikut adalah cara - cara yang harus dilakukan untuk instal http server Apache di linux ubuntu:<br />
<br />
<ul>
<li>Operasikan ( jalankan ) terminal atau dengan akses cepat <span style="font-family: "courier new" , "courier" , monospace;">CTRL + ALT + T</span></li>
<li><span style="font-family: inherit;">Kemudian tulis perintah berikut pada terminal : </span><span style="font-family: "courier new" , "courier" , monospace;">$ sudo apt-get install apache2</span></li>
<li>Lalu akan muncul pertanyaan, kemudian tekan tombol <b style="font-family: inherit;">Y</b><span style="font-family: inherit;"> untuk melanjutkan proses instalasinya.</span></li>
<li>Nah sampai disini, Server HTTP Apache sudah dalam keadaan aktif artinya siap untuk melayani request dari setiap klien.</li>
</ul>
<br />
<ul>
</ul>
<div>
Bagaimana mengetahui bahwa instalasi sudah benar dan berhasil aktif? cukup mudah untuk memeriksa apakah apache sudah aktif, langsung saja buka peramban web ( web browser ) dan kemudian masukkan alamat <i>http://localhost</i> atau bisa juga dengan alamat <i>http://127.0.0.1</i> kemudian klik Enter.</div>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj9OHzWgvmp1AO8OnYGLBAt7zVrF0KFXTN_odUU7it5PEor2iXRkefLzjYXVJnZ2KlFgoVXTjmqC9_UWmwGWWyg4XF0B4serIRMrHqHkWAMPb-MS-poCtvAHHvOQsHehKgcvRT-eMx1_GuL/s1600/Tampilan+jika+Apache+sudah+terinstal+dan+aktif+pad+linux+ubuntu.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="Tampilan jika Apache sudah terinstal dan aktif pada linux ubuntu" border="0" data-original-height="574" data-original-width="952" height="384" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj9OHzWgvmp1AO8OnYGLBAt7zVrF0KFXTN_odUU7it5PEor2iXRkefLzjYXVJnZ2KlFgoVXTjmqC9_UWmwGWWyg4XF0B4serIRMrHqHkWAMPb-MS-poCtvAHHvOQsHehKgcvRT-eMx1_GuL/s640/Tampilan+jika+Apache+sudah+terinstal+dan+aktif+pad+linux+ubuntu.png" title="Tampilan jika Apache sudah terinstal dan aktif pada linux ubuntu" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Tampilan jika Apache sudah terinstal dan aktif pada linux ubuntu</td></tr>
</tbody></table>
<div>
<h4>
</h4>
<h4>
Instal PHP di Linux Ubuntu</h4>
<div>
Tentu saja saya tidak perlu menjabarkan lagi <a href="http://blog.fispol.com/2017/06/apa-definisi-fungsi-PHP-bahasa-pemograman.html" target="_blank">apa itu PHP</a> pada anda semua, karna pendekatannya sudah penulis jelaskan pada artikel tutorial sebelumnya. Nah, Untuk meng-instal PHP di Linux, cara terbaik untuk diterapkan adalah kita dapat mengompilasi secara langsung kode sumber ( source code ) PHP itu sendiri dari awal. Walaupun demikian dalam tutorial instalasi php dilinux os kali ini kita tidak akan menggunakan cara manual seperti itu, melainkan dengan melakukan instalasi dari repositori. Karna kita menggunakan Versi PHP 7.0 maka repositorinya dapat diambil melalui repositori <span style="font-family: "courier new" , "courier" , monospace;">ppa:ondrej/php</span>.</div>
</div>
<div>
<br /></div>
<div>
Baiklah saatnya kita memulai instalasi php di linux ini dengan menjalankan terminal seperti biasa ( CTRL + ALT + T ), Dan tuliskan perintah berikut ini pada terminal linux anda:</div>
<div>
<br /></div>
<blockquote class="tr_bq">
<code>
<span style="font-family: "courier new" , "courier" , monospace;">$ sudo apt-get instal python-software-properties</span></code>
<code><span style="font-family: "courier new" , "courier" , monospace;">$ sudo add-get-repository ppa:ondrej/php</span></code>
<code><span style="font-family: "courier new" , "courier" , monospace;">$ sudo apt-get update</span></code><span style="font-family: "courier new" , "courier" , monospace;">$ sudo apt-get install -y php7.0</span></blockquote>
<div>
<br /></div>
<div>
Untuk memeriksa versi PHP, tuliskan <span style="font-family: "courier new" , "courier" , monospace;">php -v</span> ke terminal linux. Kira-kira akan tampil seperti pada gambar dibawah ini:<br />
<blockquote class="tr_bq">
<br />
<code><span style="font-family: "courier new" , "courier" , monospace;">php -v</span></code>
<code><span style="font-family: "courier new" , "courier" , monospace;">PHP 7.0.3-3+deb.sury.org~trusty+1 (cli) ( NTS )</span></code>
<code><span style="font-family: "courier new" , "courier" , monospace;">Copyright (c) 1997-2017 The PHP Group</span><span style="font-family: "courier new" , "courier" , monospace;">Zend Engine v2.3.0, Copyright (c) 1998-2017 Zend Technologies</span></code>
<code><span style="font-family: "courier new" , "courier" , monospace;"> with Zend OPcache v7.0.6-dev, Copyright (c) 2007-2017, by Zend Technologies</span></code></blockquote>
</div>
<div>
Setelah itu ( PHP sudah terpasang ), kita dapat melakukan instalasi modul-modul yang diperlukan. Daftar modul dapat diperoleh dengan menuliskan perintah dibawah ini:<br />
<blockquote class="tr_bq">
<span style="font-family: "courier new" , "courier" , monospace;">$ sudo apt-chacesearch php7-*</span></blockquote>
Setelah itu kita dapat memilih modul-modul yang diperlukan dan selanjutnya memasangnya, contoh prakteknya adalah sebagai berikut:<br />
<blockquote class="tr_bq">
<code><span style="font-family: "courier new" , "courier" , monospace;">$ sudo apt-get install php7.0-common php7.0-cli libapachace-mod-php7.0 php7.0-mysql</span></code>
<span style="font-family: "courier new" , "courier" , monospace;">php7.0-curl php7.0-json php7.0-cgi php-all-dev</span></blockquote>
</div>
<h4>
</h4>
<h4>
Menguji konfigurasi Apache dan PHP di Linux Ubuntu</h4>
<div>
Nah seperti biasa, kita harus memastikan semua konfigurasi sudah benar dan tidak ada kesalahan. Untuk memeriksa kongurasi Apache dan PHP yang baru saja kita instal dan aktifkan di OS Linux, silahkan buat file baru dengan nama ujikonfigurasi.php didalam direktori <span style="font-family: "courier new" , "courier" , monospace;">/var/www/html</span>. Simak petunjuk dan langkah berikut ini:</div>
<div>
<br /></div>
<div>
1. Buka dan Jalankan <u>terminal linux</u> ( <b>CTRL</b>+<b>ALT</b>+<b>T</b> )</div>
<div>
2. Kemudian Aktifkan direktori direktori <span style="font-family: "courier new" , "courier" , monospace;">/var/www/html </span><span style="font-family: inherit;">dengan menuliskan perintah : </span></div>
<blockquote class="tr_bq">
<span style="font-family: "courier new" , "courier" , monospace;">$ cd /var/www/html</span></blockquote>
<div>
3. Lalu buatlah file php baru, contohnya saja <span style="font-family: "courier new" , "courier" , monospace;">konfigurasi-php-linux.php</span> menggunakan aplikasi text editor (baca juga: <a href="http://blog.fispol.com/2017/06/editor-html-gratis-terbaik-untuk-macbook-macos-apple.html" target="_blank">Editor HTML MacOS / MacBook</a>) seperti gedit.</div>
<blockquote class="tr_bq">
<span style="font-family: "courier new" , "courier" , monospace;">$ sudo gedit konfigurasi-php-linux.php</span></blockquote>
<div>
4. Isi / tuliskan kode dibawah ini pada file baru <span style="font-family: "courier new" , "courier" , monospace;">konfigurasi-php-linux.php</span> <span style="font-family: inherit;">.</span></div>
<blockquote class="tr_bq">
<span style="font-family: inherit;"><?php<br /> phpinfo();<br />?></span></blockquote>
<div>
<span style="font-family: inherit;">5. Jika sudah, simpan file </span><span style="font-family: "courier new" , "courier" , monospace;">konfigurasi-php-linux.php</span></div>
6. Buka peramban / web browser dan masukkan alamat <span style="font-family: "courier new" , "courier" , monospace;">http://localhost/konfigurasi-php-linux.php</span> pada address bar dan Enter.<br />
<div>
<br />
<br />
<h4>
Instalasi MySQL di Linux Ubuntu</h4>
Ok... setelah Apache dan PHP sudah siap dinstal dan aktif, saatnya kita bersiap untuk meng-instal MySQL database di Linux Ubuntu. Tidak lain cara pertama yang harus kita lakukan adalah membuka terminal linux dan menjalankan perintah berikut ini:<br />
<blockquote class="tr_bq">
<span style="font-family: "courier new" , "courier" , monospace;">$ sudo apt-get install mysql-server-5.5</span></blockquote>
Harap dicatat: Versi mysql bisa anda sesuaikan dan pilih sesuai kebutuhan anda masing-masing, misalnya anda menginginkan versi 5.6 maka ganti perintah pada terminal linux diatas dengan <span style="font-family: "courier new" , "courier" , monospace;">mysql-server 5.6</span>.<br />
<br />
Untuk menjalankan proses instalasi saat ditanya "Do you want to continue?" maka ketik "Y". Proses instalasi akan dimulai dan linux akan meminta password untuk Root. Masukkan Password, lalu klik tombol tab untuk mengaktifkan pilihan OK lalu Enter. Masukkan password Sekali lagi dan enter untuk mengakhiri instalasi mysql.<br />
<br />
Jadi instalasi mysql di linux memang lebih sederhana, tapi masih banyak lagi yang perlu dipelajari pada artikel berikutnya tentang bagaimana menjalankan program mysql ini.<br />
<br />
Sekianlah artikel tutorial singkat ini semoga dapat menjadi bahan pembelajaran bagi anda yang sedang <a href="http://blog.fispol.com/2013/05/software-aplikasi-pembuat-website-desain-web.html" target="_blank">belajar pemograman web</a> di linux ubuntu. Bila mungkin anda pengguna windows, silahkan membaca <a href="http://blog.fispol.com/2017/05/panduan-lengkap-instalasi-php-apache.html">cara instalasi apache,php dan mysql di windows</a>. Ikuti terus update artikel tutorial disini dalam topik terkait dengan <a href="http://blog.fispol.com/search/label/PHP">PHP</a> dan <a href="http://blog.fispol.com/search/label/MySQL">MySQL</a>... Semoga bermanfaat !!!<br />
<br /></div>
Unknownnoreply@blogger.com7tag:blogger.com,1999:blog-997877103022851878.post-27638600427005880332017-06-03T13:47:00.003+07:002017-06-25T12:05:26.789+07:00 Editor HTML Gratis Terbaik untuk Belajar Web di MacOS / MacBook<b>Editor HTML MacOS</b> - Bagi seorang pengembang situs website termasuk saya dan anda sebagai pemula sekalipun tentu saja membutuhkan alat penyunting kode atau yang kita sebut sabagai <u>editor HTML</u> untuk menciptakan suatu rancangan web yang sederhana hingga canggih. Memang ada beberapa software editor html profesional dengan biaya berkualitas tinggi, namun disini kita tidak sedang membahas yang aplikasi editor mac berbayar, karna untuk sekedar <a href="http://blog.fispol.com/2013/03/belajar-HTML.html" target="_blank">belajar html</a>, aplikasi editor gratis untuk macOS sudah lebih dari cukup.<br />
<a name='more'></a><br />
<br />
Diulasan sebelumnya yang membahas tentang <a href="http://blog.fispol.com/2013/05/software-aplikasi-pembuat-website-desain-web.html" target="_blank">Software Pembuat website terbaik untuk Belajar Web Design</a> maka kali ini kita akan membahas Software Editor Gratis untuk Mac, sebagai alternative <b>Notepad++ </b>...<br />
<br />
Sekali lagi harap dicatat bahwa Editor gratisan tidak berarti kualitasnya rendah dan diragukan atau kurang baik. Editor HTML untuk MacOS terbaik dibawah ini tersedia sebagai versi evaluasi gratis secara permanen. Sehingga anda bisa "mencobanya" selama yang Anda mau. Jikalau editor itu cocok untuk Anda, sebaiknya Anda bersikap pro untuk kemudian membeli lisensinya. Di bawah ini, kami menyajikan pilihan editor HTML gratis terbaik untuk macOS yang bisa digunakan untuk menyunting kode-kode menggunakan perangkat macbook Apple OS. Ini bisa jadi pengganti atau alternative Notepad++ (notepad plus plus) yang tidak tersedia untuk dinstalasi di OS MAC.<br />
<br />
<h3 style="text-align: center;">
CotEditor Mac OS X</h3>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg5CZc6VLhLmNVBU5PXQF-Nod2uQfzdKdH9Pi7ZVhLPnncnfEVO_g1FrANZUjToDPsGUP6LZpFh-rxdUjZZ9vHJ0FZ6aTMFLObHPGZOX4uZf9p2GFU9IeGwjibRRfr6eaPDFgI82zlEPNa4/s1600/CotEditor+-Text+Editor+untuk+macOS.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="CotEditor Mac OS X" border="0" data-original-height="702" data-original-width="1329" height="336" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg5CZc6VLhLmNVBU5PXQF-Nod2uQfzdKdH9Pi7ZVhLPnncnfEVO_g1FrANZUjToDPsGUP6LZpFh-rxdUjZZ9vHJ0FZ6aTMFLObHPGZOX4uZf9p2GFU9IeGwjibRRfr6eaPDFgI82zlEPNa4/s640/CotEditor+-Text+Editor+untuk+macOS.png" title="CotEditor Mac OS X" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">CotEditor untuk MacBook</td></tr>
</tbody></table>
<br />
<ul>
<li>Hanya untuk macos - CotEditor dibuat khusus untuk macos. Ini terlihat dan berperilaku seperti aplikasi macOS seharusnya. </li>
<li>Peluncuran cepat - CotEditor diluncurkan dengan sangat cepat sehingga Anda dapat segera menulis teks Anda saat Anda menginginkannya. </li>
<li>Open Source - CotEditor dikembangkan sebagai proyek open-source yang memungkinkan setiap orang untuk berkontribusi.</li>
</ul>
<br />
CotEditor adalah <u>alat pengembang baru</u> dan segar untuk semua orang yang tidak memerlukan editornya setiap hari dan hanya menginginkan editor yang baik dengan penyorotan sintaksis. Anda dapat mempertimbangkan untuk <i>beralih</i> ke CotEditor dari <i>Notepad ++</i> untuk OS X. Selain penyelesaian kode yang layak, fungsi search dan replace yang bagus, tampilan split untuk mempartisi jendela editor di beberapa bidang, penyisipan sintaks yang baik untuk 40 bahasa pemrograman dan hadir Dengan delapan tema. Untuk editor sederhana MacBook, Anda dapat menyesuaikan aplikasi lebih dari yang Anda duga, dan menurut saya Editor HTML ini bisa jadi unggulan dan terbaik.<br />
<br />
Fitur dari Editor ini:<br />
<ol>
<li><b>Syntax Highlighting</b> yang Lengkap - Ada lebih dari 50 bahasa utama yang didukung oleh kode editor ini seperti HTML, PHP, Python, Ruby atau Markdown, dan lain lain.</li>
<li><b>Pencarian kode & Replace</b> - Super cepat untuk mencari dan mengganti menggunakan mesin regular expression ICU. </li>
<li><b>Pengaturan yang mudah</b> - Tidak ada file konfigurasi yang rumit yang membutuhkan pengetahuan expert. Anda dapat mengakses semua pengaturan, termasuk definisi dan tema sintaks dari jendela preferensi standar. </li>
<li><b>Backup Otomatis</b> - Tidak perlu takut akan kehilangan data yang belum disimpan. CotEditor ini mencadangkan dokumen anda secara otomatis saat mengedit. </li>
<li><b>Menu Outline</b> - Ekstrak baris tertentu dengan sintaks yang telah ditentukan, dan Anda dapat melompat ke baris yang sesuai. </li>
<li><b>Split Editor</b> - Membagi sebuah jendela menjadi beberapa panel untuk melihat berbagai bagian dokumen Anda secara bersamaan. </li>
<li><b>Character Inspector</b> - Periksa data karakter Unicode dari setiap karakter yang dipilih di dokumen Anda dan tampilkan di pop over. </li>
<li><b>Scriptable</b> - Buat makro sendiri dalam bahasa favorit Anda, apakah itu Python, Ruby, Perl, PHP, UNIX shell, AppleScript atau JavaScript. </li>
</ol>
<div>
Penasaran bagaimana editor kode ini bekerja? silahkan kunjungi <a href="http://coteditor.com/" rel="nofollow" target="_blank">coteditor.com</a> untuk mendownload software gratis ini sekarang juga !</div>
<div>
<h3 style="text-align: center;">
</h3>
<h3 style="text-align: center;">
Bracket - Editor kode HTML untuk MAC</h3>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgr3FHH5iyamgjwUpZbcbuJBAEr3FUALSeOC-pzAK0TduWVcFOKxVrZFFMV7vzJ_lj9aImeojiYKb7YsIXQ8PZl3laYvD7i9qNYnu383y2GNac87ysG-Jj_XAQ4f-jZ-0k5TQxIDV4MsJET/s1600/Bracket+-+Editor+kode+HTML+untuk+MAC.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="Bracket - Editor kode HTML untuk MAC" border="0" data-original-height="633" data-original-width="1068" height="377" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgr3FHH5iyamgjwUpZbcbuJBAEr3FUALSeOC-pzAK0TduWVcFOKxVrZFFMV7vzJ_lj9aImeojiYKb7YsIXQ8PZl3laYvD7i9qNYnu383y2GNac87ysG-Jj_XAQ4f-jZ-0k5TQxIDV4MsJET/s640/Bracket+-+Editor+kode+HTML+untuk+MAC.png" title="Bracket - Editor kode HTML untuk MAC" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Bracket - Editor kode HTML untuk MAC</td></tr>
</tbody></table>
<div>
<br /></div>
Bracket adalah <b>software editor MacOs</b> open source yang modern dengan beberapa fitur yang sangat menarik dan juga pro pengembang. Bracket memadukan alat visual ke dalam editor sehingga Anda mendapatkan bantuan yang tepat bila Anda menginginkannya tanpa menghalangi proses kreatif Anda. Anda akan senang menulis <a href="http://blog.fispol.com/2017/06/editor-html-gratis-terbaik-untuk-macbook-macos-apple.html">kode html di macbook</a> dengan bracket ini. Misalnya, bila digunakan dalam kombinasi dengan Adobe Creative Cloud Extract, ia dapat membaca data desain seperti warna, jenis, riwayat dll langsung dari file PSD dan mengubahnya menjadi kode CSS yang minimalis dan benar. Demikian juga, Anda dapat mengekstrak lapisannya sebagai gambar, menggunakan informasi dari PSD sebagai variabel dalam preprocessor, dan dengan mudah menentukan jarak dan proporsi elemen, menariknya adalah semuanya itu dapat dilakukan tanpa keluar dari editor. Sebagai catatan bahwa menggunakan Adobe Creative Cloud memerlukan langganan berbayar.<br />
<br />
Dukungan penuh dari <b>Preprocessors</b> juga menjadi pertimbangan penting untuk menjadikan editor ini adalah penyunting terbaik di MacOs. Dengan Bracket, Anda bisa menggunakan "edit cepat" dan "live preview" saat bekerja dengan Bracket dan juga file SCSS, yang membuat proses kerja menjadi lebih mudah. Software ini cocok untuk pemula bahkan editor ini bisa menjawab kebutuhan seorang profesional.<br />
<br />
Untuk mendownload dan menggunakannya secara gratis di perangkat MacBook anda, Kunjungi <a href="http://brackets.io/" rel="nofollow" target="_blank">Bracket.io</a>.<br />
<br />
<h3 style="text-align: center;">
Google Web Designer</h3>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjcC_snLPp_J6RuMUcFK3d8R40ObD5pAUSew545a9Bx7pxI_iox24jG17dDr_9wFOZxbjJWtgnGCsu_Ib_F1j0AnQwKiCPdR7-qYJOe0pa4Jdbk50_BtZGI37hNth4Qq-VTc-QqVDfXPk2P/s1600/Google+Web+Designer+-+Editor+HTML5+Mac+Os.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="Google Web Designer - Editor HTML5" border="0" data-original-height="768" data-original-width="1366" height="358" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjcC_snLPp_J6RuMUcFK3d8R40ObD5pAUSew545a9Bx7pxI_iox24jG17dDr_9wFOZxbjJWtgnGCsu_Ib_F1j0AnQwKiCPdR7-qYJOe0pa4Jdbk50_BtZGI37hNth4Qq-VTc-QqVDfXPk2P/s640/Google+Web+Designer+-+Editor+HTML5+Mac+Os.png" title="Google Web Designer - Editor HTML5" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Google Web Designer - Editor HTML5</td></tr>
</tbody></table>
<div>
<br /></div>
Google? Ya, <b>Google</b> !!!<br />
<br />
<blockquote class="tr_bq">
<i><u>Google Web Designer</u></i> memberikan Anda kemampuan untuk membuat konten HTML5 yang indah dan menarik. Gunakan elemen animasi dan interaktif untuk menghadirkan visi kreatif Anda terhadap kehidupan melalui pengembangan yang kreatif, dan nikmati integrasi dengan produk Google lainnya, seperti Google Drive, DoubleClick Studio, dan AdWords.</blockquote>
<br />
Ternyata Google yang terkenal dengan mesin pencari raksasanya juga menyediakan alat untuk pengembang dan web designer. Hanya saja Google Web Designer ini bekerja lebih mirip dengan Adobe Dreamweaver. Jadi bisa dibilang jika Ini bukanlah editor HTML murni, namun gabungan WYSIWYG (Apa yang Anda lihat adalah apa yang Anda dapatkan) dengan editor teks. Anda dapat bekerja dengan kedua antarmuka yaitu antarmuka grafis dan tampilan kode.<br />
<br />
Menurut saya Google Web Designer selalu menghasilkan kode HTML5 dan CSS3 yang benar dari antarmuka grafis. Apakah itu benar? tentu saja benar.<br />
<br />
Tanpa pengujian menyeluruh, tidak banyak yang bisa dikatakan tentang editor ini. Bahkan informasi di situs editor agak jarang, yang mungkin sampai pada kenyataan bahwa ia masih dalam tahap beta-nya. Namun, konsepnya menarik bukan? Untuk mencoba silahkan dapatkan informasi dan download di <a href="http://www.google.com/webdesigner" rel="nofollow" target="_blank">www.google.com/webdesigner</a>.<br />
<br />
<h4>
Yang terbaik untuk MacOs...</h4>
<div>
Nah beberapa referensi diatas hanyalah sebagian kecil dari software editor HTML yang bisa digunakan di Macbook yang bersistem operasi Mac Os. Urutan referensi diatas bukan berdasarkan urutan terbaik. Jadi mana yang terbaik? yang terbaik hanya bisa ditentukan dengan pengalaman saat menggunakan masing masing editor ini. Jika saya ditanya editor mana yang saya gunakan di macbook saya saat ini maka jawabnya adalah Bracket. Bagaimana dengan Anda? ini tentu akan sesuai dengan kebutuhan anda masing masing. Jadi saya sarankan anda patut mencoba salah satu referensi software editor diatas, yang gratis dan populer.</div>
<br /></div>
Unknownnoreply@blogger.com5tag:blogger.com,1999:blog-997877103022851878.post-42776957345300184242017-05-15T10:29:00.000+07:002017-06-25T12:05:51.154+07:00Panduan Lengkap Instalasi PHP, Apache, MySQL di Windows<div class="tr_bq">
<b>Panduan (Tutorial) Lengkap Instalasi PHP, Apache, MySQL di Windows</b> - Hari ini kita akan belajar tutorial instal aplikasi pendukung pemograman PHP dan HTML, yaitu cara melakukan instalasi software yang diperlukan untuk mempelajari pemrograman web menggunakan PHP di perangkat Window baik itu win 7 hingga win 10 . Jika Anda menggunakan sistem operasi Linux (Ubuntu), silahkan membaca artikel selanjutnya yang akan segera di update, di halaman Instal <a href="http://blog.fispol.com/2017/06/tutorial-instal-apache-php-mysql-linux-ubuntu.html" target="_blank">Apache, dan MySQL di Linux Ubuntu</a>.<br />
<a name='more'></a><br />
<br />
<blockquote class="tr_bq">
Satu hal yang menjadi tantangan bagi pemula adalah kita akan men-download dan konfigurasi secara manual di komputer bersistem operasi windows tanpa menggunakan pihak ketiga seperti XAMPP atau LAMPP. Sehingga web server lokal kita dapat digunakan untuk keperluan belajar ataupun pengembangan aplikasi yang akan diciptakan.</blockquote>
<br />
<br />
<table cellpadding="0" cellspacing="0" class="tr-caption-container" style="float: left; margin-right: 1em; text-align: left;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9Qo_qr36vsisQovpB7p5Yint8Puj6qCFQHQTHgSjkIl8Dd7d_XOonAuN07xp92E5ikN4EBHZzWbBYu5naAEoqwXEygzqYHrBLPT0eqX6NALyNrG44j-yhtW-Rct5YuAg6ALaFtvU5ucYl/s1600/Web+Server+Apache+-+PHP+-+MySQL.jpg" imageanchor="1" style="clear: left; margin-bottom: 1em; margin-left: auto; margin-right: auto;"><img alt="Web Server Apache dengan PHP dan MySQL" border="0" height="280" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9Qo_qr36vsisQovpB7p5Yint8Puj6qCFQHQTHgSjkIl8Dd7d_XOonAuN07xp92E5ikN4EBHZzWbBYu5naAEoqwXEygzqYHrBLPT0eqX6NALyNrG44j-yhtW-Rct5YuAg6ALaFtvU5ucYl/s320/Web+Server+Apache+-+PHP+-+MySQL.jpg" title="Web Server Apache dengan PHP dan MySQL" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Web Server Apache dengan PHP dan MySQL Diwindows</td></tr>
</tbody></table>
Dalam artikel ini kita akan belajar tutorial tentang:
<br />
<ul>
<li><a href="http://blog.fispol.com/2017/05/panduan-lengkap-instalasi-php-apache.html"><span style="color: black;">Cara instal PHP 7 di Windows</span></a></li>
<li>Cara Menginstal dan Aktifasi Apache,PHP,Mysql di windows</li>
<li><span style="color: black;">Cara instalasi php tanpa menggunakan xampp</span></li>
<li>Link Download Apache,PHP dan Mysql</li>
</ul>
</div>
<br />
Perlu Anda ketahui bahwa PHP, Apache, dan MySQL merupakan tiga software yang berbeda dan tidak saling berkaitan serta dikembangkan oleh vendor yang berbeda. Diperlukan suatu konfigurasi tertentu untuk menjadikan ketiga software tersebut dapat berkomunikasi dan bekerja dengan benar.<br />
<br />
<br />
<h4>
Fungsi dari Software PHP, Apache, dan MySQL </h4>
Untuk mempelajari <a href="http://blog.fispol.com/2013/09/panduan-tutorial-dasar-belajar-web-html-website-untuk-pemula.html" target="_blank">pemrograman web</a>, kita memerlukan komputer yang berperan sebagai server dan komputer yang berperan sebagai klien <a href="http://blog.fispol.com/2013/05/software-aplikasi-pembuat-website-desain-web.html" target="_blank">Aplikasi-aplikasi web</a> yang ditulis menggunakan bahasa pemrograman tertentu (bukan hanya PHP) harus disimpan di dalam komputer server. Pengunjung web (user) akan meminta file-file tersebut melalui software web browser yang terpasang di komputer klien tersebut.<br />
<br />
Agar suatu komputer dapat diperankan sebagai komputer server, komputer tersebut harus dipasang software HTTP server, atau yang dikenal juga dengan sebutan software web server'. HTTP server bertugas melayani permintaan-permintaan URL yang dikirim oleh komputer klien, memproses permintaan tersebut (dengan bantuan software lain), dan kemudian meresponnya kembali ke komputer klien. Jika aplikasi web yang dibuat melibatkan penyimpanan data di dalam database, maka komputer server tersebut juga harus memiliki software server database.<br />
<br />
Terdapat beberapa software yang dapat digunakan sebagai HTTP server, Misalnya yang populer Apache HTTP Server (sering disebut singkat: Apache), LightTPD dan nginx dibaca: Engine X). Demikian juga dengan software database server, kita dapat menggunakan MySQL, PostgreSQL, Oracle, dan sebagainya. Pada Tutorial ini, kita akan menggunakan Apache sebagai software HTTP server dan MySQL sebagai database server.<br />
<br />
Ketika permintaan yang dilakukan oleh klien berjenis Apache akan meminta bantuan ke interpreter PHP untuk menerjemahkan kode-kode yang terdapat di dalam file tersebut menjadi kode HTML. Inilah peran dari software PHP Jika Anda ingin bekerja dengan satu komputer, maka komputer tersebut harus dapat diperankan sebagai komputer server sekaligus sebagai komputer klien. karena itu, semua software yang diperlukan (PHP dan MySQL untuk server serta web browser untuk klien) harus dipasang di satu komputer tersebut.<br />
<br />
<h4>
Download Software PHP, Apache, dan MysQL Untuk Windows</h4>
Untuk mendapatkan Software PHP, Apache, dan MySQL for windows terbaru dapat di download dari alamat- alamat web berikut:<br />
<ul>
<li>Download PHP versi Windows --> <a href="http://windows.php.net/download/" rel="nofollow" target="_blank">http://windows.php.net/download/</a> </li>
<li>Download Apache --> <a href="https://www.apachelounge.com/download/" rel="nofollow" target="_blank">https://www.apachelounge.com/download/</a></li>
<li>Download Mysql --> <a href="http://dev.mysql.com/downloads/mysql/" rel="nofollow" target="_blank">http://dev.mysql.com/downloads/mysql/</a></li>
</ul>
Saat artikel ini ditulis, versi PHP terbaru adalah 7.0. Pada artikel ini, kita akan menggunakan PHP 7.0, Apache 2.4, dan MysQL 5.0<br />
<br />
<h4>
Software Pendukung yang Diperlukan pada Windows anda</h4>
Khusus untuk sitem operasi berbasi windows ini yaitu untuk keperluan penulisan kode program, kita akan memerlukan software Text Editor ( baca juga --> <a href="http://blog.fispol.com/2017/06/editor-html-gratis-terbaik-untuk-macbook-macos-apple.html" target="_blank">Editor HTML Gratis Terbaik untuk Belajar Web di MacOS / MacBook</a> dan <a href="http://blog.fispol.com/2013/05/software-aplikasi-pembuat-website-desain-web.html" target="_blank">rekomendasi software untuk belajar web</a> ). Software Text Editor yang digunakan bisa berupa apa saja, Notepad, Notepad++, Sci TE, dan sebagainya. Saat ini, sudah banyak beredar IDE (Integrated Development Environment) untuk PHP yang dapat Anda pilih dan unduh (download) dari internet.<br />
<br />
Instalasi Visual C++ 2015 Redistributable PHP 7.o dan Apache 2.4.18 versi Windows dikompilasi menggunakan Visual C++ 2015. Oleh karena itu, sebelum kita melakukan instalasi PHP dan Apache, kita perlu melakukan instalasi Visual C++ 2015 Redistributable terlebih dahulu. Visual C++ 2015 Redistributable adalah komponen runtime dari pustaka Visual C++ yang dibutuhkan untuk menjalankan aplikasi-aplikasi yang dikembangkan menggunakan Visual C++ 2015 di dalam komputer yang tidak terpasang Visual C++ 2015. Jika Anda sebelumnya telah memasang Visual Studio 2015, maka Anda tidak perlu memasang software Visual C++ 2015 Redistributable.<br />
<blockquote class="tr_bq">
Untuk melakukan instalasi Visual C++ 2015 Redistributable, silahkan Anda jalankan file vc 2015 redist. x86. exe.</blockquote>
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjn1eky6JK7VQkcQTZiXYW7EziIvTcQDZOC1Ju7Or3KDtMRfF2c1VAjmWiNAn1tPrN3_7z4vgBnGJyr44gjHFDQwZA5vHIfiafIR0mhNRnqtaOJGxu9CA84AH1FY5nFsztaxrISesmG5lhk/s1600/Instalasi+Softrware+Pendukung.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjn1eky6JK7VQkcQTZiXYW7EziIvTcQDZOC1Ju7Or3KDtMRfF2c1VAjmWiNAn1tPrN3_7z4vgBnGJyr44gjHFDQwZA5vHIfiafIR0mhNRnqtaOJGxu9CA84AH1FY5nFsztaxrISesmG5lhk/s1600/Instalasi+Softrware+Pendukung.png" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<h3 style="-webkit-box-shadow: rgb(255, 255, 255) 0px 1px 0px inset, rgb(255, 255, 255) 0px 1px 0px; background-color: #ebebeb; border-bottom-color: rgb(186, 186, 186); border-bottom-style: solid; border-top-color: rgb(186, 186, 186); border-top-style: solid; border-width: 1px 0px; box-shadow: rgb(255, 255, 255) 0px 1px 0px inset, rgb(255, 255, 255) 0px 1px 0px; color: #333333; font-family: inherit; font-size: inherit; font-style: inherit; font-variant: inherit; line-height: 23.99305534362793px; margin: 0.25em 0px; outline: 0px; padding: 0.25em 0px; text-align: center; vertical-align: baseline;">
Instal dan Konfigurasi Apache + PHP Windows</h3>
<div style="text-align: center;">
Nah langsung saja, setelah software telah didapatkan dari link download diatas, sekarang kita akan belajar mempersiapkan apache dan PHP telebih dahulu, sedangkan instalasi MySQL akan kita bahas diakhir.</div>
<br />
<h4>
Cara Instal PHP di Windows</h4>
Setelah Visual C++ 2015 terpasang di komputer, Anda dapat melanjutkan pekerjaan dengan memasang (instal) software PHP (<a href="http://blog.fispol.com/2017/06/apa-definisi-fungsi-PHP-bahasa-pemograman.html" target="_blank">Apa itu PHP</a>?) dengan cara dibawah ini:<br />
<br />
<ol>
<li>Buat direktori (folder) baru dengan nama <span style="font-family: "courier new" , "courier" , monospace;">PHP70</span> di dalam drive C.</li>
<li>Ektrak file <span style="font-family: "courier new" , "courier" , monospace;">php-7.0.0-Win32-vc14-x86.zip</span>, lalu salin (copy) atau pindahkan semua file hasil ekstraksi ke direktori <span style="font-family: "courier new" , "courier" , monospace;">c:\PHP70</span>.</li>
<li>Ubah nama file <span style="font-family: "courier new" , "courier" , monospace;">php.ini-development</span> di dalam direktori <span style="font-family: "courier new" , "courier" , monospace;">c:\PHP70</span> menjadi php.ini.</li>
<li>Buka file <span style="font-family: "courier new" , "courier" , monospace;">php.ini</span> menggunakan aplikasi Text Editor (misalnya: Notepad)</li>
<li>Hilangkan tanda titik koma di depan teks <span style="font-family: "courier new" , "courier" , monospace;">extension_dir</span> yang terdapat di dalam <span style="font-family: "courier new" , "courier" , monospace;">php.ini</span> dan isi nilainya dengan "c<span style="font-family: "courier new" , "courier" , monospace;">:/PHP70/ext</span>".</li>
<li>Simpan perubahan yang telah Anda lakukan terhadap file <span style="font-family: "courier new" , "courier" , monospace;">php.ini.</span> </li>
</ol>
<br />
<h4>
Instalasi Apache di Windows</h4>
Selanjutnya untuk menginstal Apache di windows dapat dilakukan menggunakan langkah-langkah berikut:<br />
<br />
<ul>
<li>Ekstrak file <span style="font-family: "courier new" , "courier" , monospace;">httpd-2.4.18-win32-vo14.zip</span>, lalu salin (copy) direktori <span style="font-family: "courier new" , "courier" , monospace;">Apache24</span> ke drive C.</li>
<li>Buka file <span style="font-family: "courier new" , "courier" , monospace;">c:\Apache24\conf\httpd.conf,</span> lalu isikan teks berikut di bagian paling akhir file:</li>
</ul>
<blockquote class="tr_bq">
LoadModule php7_module "C: /PHP70/php7apache2_4.dll" <br />
AddHandler application/x-httpd-php.php <br />
#konfigurasi path untuk php.ini<br />
PHPIniDir "C:\PHP70"</blockquote>
<ul>
<li>Tambahkan juga <span style="font-family: "courier new" , "courier" , monospace;">index.php</span> pada bagian <span style="font-family: "courier new" , "courier" , monospace;">DirectoryIndex</span>, seperti:</li>
</ul>
<blockquote>
<code>
#</code><br />
<code>
# DirectoryIndex: sets the file that apache will serve if a directory<br /> </code><code>
#is requsted.<br /> </code><code>
#<br /> </code><code>
<IfModule dir_module></code><br />
<code>
DirectoryIndex index.php indeh.html<br /> </code><code>
</IfModule></code></blockquote>
<br />
<h4>
Membuat dan Memulai Service Apache di Windows</h4>
<div>
Agar HTTP Server bisa dijalankan pada os windows, kita perlu membuat service untuk software Apache dengan cara berikut:</div>
<div>
<br /></div>
<div>
1.Jalankan program Command Prompt dengan Hak Administrator ( Run as Administrator ). Program Command Prompt dapat dijalankan dengan mengetikkan teks "<span style="font-family: "courier new" , "courier" , monospace;">CMD</span>" (tanpa tanda kutip) kedalam kotak search di windows anda.</div>
<div>
<br /></div>
<div>
2.Aktifkan direktori <span style="font-family: "courier new" , "courier" , monospace;">C:\Apache24\bin</span> dengan mengetikkan perintah berikut:</div>
<blockquote class="tr_bq">
<span style="font-family: "courier new" , "courier" , monospace;">cd/</span><span style="font-family: "courier new" , "courier" , monospace;">cd Apache24 \bin</span></blockquote>
<div>
3.Ketikkan perintah berikut untuk membuat services Apache didalam sistem operasi windows.</div>
<blockquote class="tr_bq">
<span style="font-family: "courier new" , "courier" , monospace;">httpd - k install</span></blockquote>
Untuk mengaktifkan Apache:<br />
<br />
<ol>
<li><span style="font-family: "courier new" , "courier" , monospace;">Control Panel > Administrative Tools > Services.</span></li>
<li><span style="font-family: inherit;">Cari dan klik kanan pada apache24, lalu pilih START. </span></li>
<li><span style="font-family: inherit;">Pastikan anda mendapatkan status "STARTED" ketika menjalankan services tersebut.</span></li>
</ol>
<h4>
<span style="font-family: inherit;"><br /></span></h4>
<h4>
<span style="font-family: inherit;">Uji Konfigurasi Apache, PHP dan Mysql, Apakah sudah terinstal dengan benar?</span></h4>
<span style="font-family: inherit;">Untuk memeriksa apakah apache sudah dapat melayani permintaan URL atau malah terjadi trouble, sebaiknya jalankan pemeriksaan. Buka aplikasi browser misalnya internet explore atau google chrome dan ketikkan alamat berikut kotak alamat situs dan coba untuk mengaksesnya: </span><span style="font-family: "courier new" , "courier" , monospace;">http://localhost</span><span style="font-family: inherit;"> atau </span><span style="font-family: "courier new" , "courier" , monospace;">http://127.0.0.1</span><br />
<span style="font-family: "courier new" , "courier" , monospace;"><br /></span>
<span style="font-family: inherit;">Sedangkan untuk menguji dan memeriksa apakah apache sudah dapat melayani permintaan file </span><span style="font-family: "courier new" , "courier" , monospace;">.php</span><span style="font-family: inherit;"> atau belum, sekaligus memeriksa apakah instalasi PHP sudah benar. Silahkan buat sebuah file baru dengan nama uji.php, lalu simpan didalam direktori</span><span style="font-family: "courier new" , "courier" , monospace;"> c:\Apache24\htdocs</span>. Isikan kode berikut dalam file php yang anda buat:<br />
<blockquote class="tr_bq">
<?php<br />
phpinfo();<br />
?></blockquote>
<span style="font-family: inherit;">Jika benar konfigurasi adalah sukses maka seharusnya jika mengakses alamat http://localhost/uji.php maka akan menampikan halaman tentang informasi versi PHP yang sedang kita gunakan.</span><br />
<span style="font-family: inherit;"><br /></span>
<span style="font-family: inherit;"><br /></span>
<br />
<h3 style="background-color: #ebebeb; border-bottom-color: rgb(186, 186, 186); border-bottom-style: solid; border-top-color: rgb(186, 186, 186); border-top-style: solid; border-width: 1px 0px; box-shadow: rgb(255, 255, 255) 0px 1px 0px inset, rgb(255, 255, 255) 0px 1px 0px; color: #333333; font-family: inherit; font-size: inherit; font-style: inherit; font-variant: inherit; line-height: 23.9931px; margin: 0.25em 0px; outline: 0px; padding: 0.25em 0px; text-align: center; vertical-align: baseline;">
Instalasi MySQL di Windows</h3>
<div style="text-align: center;">
Baik, kini setelah Apache + PHP sudah terisntal dengan benar maka sekarang adalah untuk mengkonfigurasi database untuk penyimpanan data di web server yang akan kita guanakan secara lokal dikomputer windows.</div>
<br />
<h4>
<br />Cara instal MySQL di Windows</h4>
Software MySQL digunakan utnuk menyimpan data yang diperlukanoleh aplikasi. Anda akan mempelajari materi tentang akses database pada artikel mendatang dibagian lain blog ini. Sedangkan kali ini kita akan membahas tentang proses instalasi dan konfigurasinya saja.<br />
<br />
Berikut adalah tutorial langkah-langkah atau cara untuk melakukan instalasi dan konfigurasi MySQL.<br />
<br />
1. Jalankan file MySQL yang telah kita download sebelumnya "mysql-essential-5.0.24a-win32.msi" ( Nama file bisa berbeda tergantung versi yang anda download ).<br />
<br />
2. Akan muncul dialog box penginstalan pertama seperti gambar di bawah ini. Silahkan centang "I accept the license terms". Lanjutkan dengan mengklik tombol Next untuk melanjutkan proses instalasi.<br />
<br />
<div style="text-align: center;">
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEivBkqUIKTcDCth5N2YEyHdB_HQ6VYgfpLVyFomZTn-Ue69_xl4eh7SqB7Om0IVsO8gtV1oEGNFxf_eOWEIcJ34xWEg9ixXuCMC4cge_MmLrpp9SaP4PfAp0wjRt5j9gbDo3Hz0e8jO_DmT/s1600/Cara+Instal+MySQL+-+Installer.jpg" style="margin-left: auto; margin-right: auto;"><img alt="MySQL installer" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEivBkqUIKTcDCth5N2YEyHdB_HQ6VYgfpLVyFomZTn-Ue69_xl4eh7SqB7Om0IVsO8gtV1oEGNFxf_eOWEIcJ34xWEg9ixXuCMC4cge_MmLrpp9SaP4PfAp0wjRt5j9gbDo3Hz0e8jO_DmT/s400/Cara+Instal+MySQL+-+Installer.jpg" title="MySQL installer" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Instalasi PHP, Apache dan MySQL di OS Windows</td></tr>
</tbody></table>
</div>
<br />
<br />
3. Pada dialog box Setup pertama, Akan terdapat pilihan pilihan, antara lain:<br />
<br />
<ul>
<li><span style="font-family: "courier new" , "courier" , monospace;">Developer Default -</span>Apabila Anda memilih pilihan ini, maka MySQL akan menginstal aplikasi MySQL yang dibutuhkan untuk development.</li>
<li><span style="font-family: "courier new" , "courier" , monospace;">Server only -</span>Pilihlah pilihan ini jika Anda ingin menginstal aplikasi MySQL untuk server.</li>
<li><span style="font-family: "courier new" , "courier" , monospace;">Client only -</span>Pilihlah pilihan ini jika Anda ingin menginstal aplikasi MySQL untuk client.</li>
<li><span style="font-family: "courier new" , "courier" , monospace;">Full -</span>Apabila Anda ingin memilih seluruh aplikasi MySQL, maka pilihlah pilihan ini.</li>
<li><span style="font-family: "courier new" , "courier" , monospace;">Custom -P</span>ilihan ini berguna apabila Anda ingin memilih sendiri aplikasi MySQL yang akan diinstal.</li>
</ul>
<br />
Pilihlah pilihan <span style="font-family: "courier new" , "courier" , monospace;">Custom</span>, kemudian klik tombol Next.<br />
<br />
4. Pada dialog box Select Products and Features, silahkan klik tanda tambah (+) di samping kiri teks MySQL Servers. Kemudian klik tanda tambah (+) lagi di samping kiri teks MySQL Server. Untuk untuk melebarkan pilihan yang diciutkan.<br />
<blockquote class="tr_bq">
Catatan: Jika anda menggunakan windows 64-bit, pilihlah MySQL Server 5.7.10 – X64. dan jika anda menggunakan windows 32-bit pilih MySQL Server 5.7.10 – X86. Dan karna penulis sendiri menggunakan Windows 7 yang 32-bit maka pada artikel ini akan memilih MySQL Server 5.7.10 – X86. </blockquote>
<br />
<ul>
<li>Kemudian klik tombol panah kanan yang bewarna hijau. Pada <span style="font-family: "courier new" , "courier" , monospace;"><b>Products/Features To Be Installed</b></span>, silahkan klik <span style="font-family: "courier new" , "courier" , monospace;">MySQL Server 5.7.10 – X86</span>. </li>
<li>Kemudian klik <b><span style="font-family: "courier new" , "courier" , monospace;">Advanced Options</span></b>.</li>
<li>Pada kolom Install Directory isi dengan <span style="font-family: "courier new" , "courier" , monospace;">C:\MySQL 5.7</span></li>
<li>Pada kolom Data Directory isikan <span style="font-family: "courier new" , "courier" , monospace;">C:\MySQL 5.7\Data</span>. </li>
<li>Selanjutnya, klik tombol <b>OK</b>. Selanjutnya klik pada tombol <b>Next</b>.</li>
</ul>
<br />
5. Akan tampil dialog box Installation, silahkan klik tombol <b>Execute</b> untuk memulai proses pada komputer anda. Kemudian klik tombol <b>Next</b>.<br />
<br />
6. Di layar dialog box <b>Product Configuration</b> klik tombol <b>Next</b>.<br />
<br />
7. Pada dialog box <b>Type and Networking</b>, biarkan saja pada isian default nya. Kemudian klik tombol <b>Next</b> untuk melanjutkan.<br />
<br />
8. Tahap selanjutnya akan ada dialog box <b>Accounts and Roles</b>, silahkan masukan <span style="font-family: "courier new" , "courier" , monospace;">password</span>. Yang mana password ini dibuat untuk <span style="font-family: "courier new" , "courier" , monospace;">user root</span>. User root adalah user tertinggi di dalam MySQL atau biasa disebut juga superuser. Kemudian klik tombol <b>Next</b>.<br />
<br />
9. Pada dialog box <b>Windows Service</b>, biarkan saja pada isian default nya. Kemudian klik tombol <b>Next</b>.<br />
<br />
10. Selanjutnya akan ada tampilan dialog box <b>Apply Server Configuration</b>, silahkan klik tombol <b>Execute</b>. Jika tidak ada masalah, klik tombol <b>Finish</b>.<br />
<br />
11. Untuk menyelesaikan konfigurasi, Pada dialog box <b>Product Configuration</b>, silahkan klik tombol <b>Next</b>. Pada dialog box Installation Complete, silahkan klik tombol <b>Finish</b>.<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgi29k6u9ySMQowM8hDm9xMdtE7bfE1ZNy_zThksJabwInfWq-iyYZOreMgeExE5UP7ij1eMbo2mTexyrjBLLVR_UwcaL67CC_DdMWpws9oB7zJiNeMzOFR9tYJohPBoNXtORp7KUXpVPYs/s1600/Instal+MySQL+Windows+Selesai.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="237" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgi29k6u9ySMQowM8hDm9xMdtE7bfE1ZNy_zThksJabwInfWq-iyYZOreMgeExE5UP7ij1eMbo2mTexyrjBLLVR_UwcaL67CC_DdMWpws9oB7zJiNeMzOFR9tYJohPBoNXtORp7KUXpVPYs/s320/Instal+MySQL+Windows+Selesai.jpg" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Instalasi MySQL di Windows selesai</td></tr>
</tbody></table>
<br />
Nah sampai disini langkah Instalasi MySQL telah selesai. Dan seperti biasa kita perlu memastikan apakah MySQL telah teristal dengan benar dan biasa digunakan semestinya. Praktikkan cara berikut untuk mengetest mysql yang telah diinstal di komputer windows.<br />
<br />
<br />
<ul>
<li>Pada komputer anda Klik <b>Start Menu</b> > <b>All Programs</b> > <b>MySQL</b> > <b>MySQL Server 5.7</b> > <span style="font-family: "courier new" , "courier" , monospace;">MySQL 5.7 Command Line Client</span>. </li>
<li>Silahkan masukan password user yang telah kita buat sebelumnya, yaitu password user root. Apabila password yang dimasukan valid dan tidak ada masalah, maka tampilannya seperti gambar di bawah ini.</li>
</ul>
<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJ9TJkkc7WsxzaKKta9dZqV8oZZyi6IarOZ8WfBzHlIbkIBQy3DCoDJvkh0EM3bvdHlaACyvHsxUV0L2PTiNG3spkBv5h29ziQe0fu44iFDzO5FYrw9z8PIR_OiSZQah0otdWDEvqXOwst/s1600/Mengecek+Instalasi+MySQL.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="Hasil Cek Instal MySQL Windows" border="0" height="161" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJ9TJkkc7WsxzaKKta9dZqV8oZZyi6IarOZ8WfBzHlIbkIBQy3DCoDJvkh0EM3bvdHlaACyvHsxUV0L2PTiNG3spkBv5h29ziQe0fu44iFDzO5FYrw9z8PIR_OiSZQah0otdWDEvqXOwst/s320/Mengecek+Instalasi+MySQL.jpg" title="Hasil Cek Instal MySQL Windows" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Hasil Cek Instal MySQL di Windows</td></tr>
</tbody></table>
<br />
Demikianlah panduan untuk instalasi apache disertai PHP dan MySQL pada sistem operasi berbasis <b>Windows</b>, semoga dapat bermanfaat bagi pembaca yang sedang belajar dasar pemograman web. Kita akan kembali menjelaskan lanjutannya pada artikel berikut di blog ini. Oh ya, bagi yang menggunakan sistem operasi selain windows, bisa membaca artikel berikutnya tentang <a href="http://blog.fispol.com/2017/06/tutorial-instal-apache-php-mysql-linux-ubuntu.html" target="_blank">Bagaimana instal PHP dan Mysql pada sistem operasi Linux</a>. Semoga bermanfaat !!!<br />
<br />Unknownnoreply@blogger.com8tag:blogger.com,1999:blog-997877103022851878.post-77628433430981676952017-05-12T22:33:00.000+07:002017-06-25T12:06:19.919+07:00Cara Membuat Blog Baru di Blogger dan Wordpress <b>Cara Membuat Blog di Blogger dan WordPress</b> - Artikel tentang membuat blog ini sudah pernah ditulis sebenarnya, namun disini saya akan menulis kembali kepada blogger dengan cara cara terbaru lengak dengan tutorial bagaimana cara membuat blog dan ditambah informasi yang mungkin perlu diketahui sebalum kita buat blog.<br />
<a name='more'></a><br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj5AgS4CVmj6ZmqtL8iHOqESNb228NdYdunePYXcU2-mcs05tW3Mfxa2gIgERzBQD0VEYJLAmD8ImEcDXtyVJqFSSVLkh_GV6Zx6yAyz2-a9kkg8uMhaK4ELr5M71F9v-LhYT6eqCRPDhkn/s1600/Cara+Membuat+Blog.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="Cara Membuat Blog Baru" border="0" height="187" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj5AgS4CVmj6ZmqtL8iHOqESNb228NdYdunePYXcU2-mcs05tW3Mfxa2gIgERzBQD0VEYJLAmD8ImEcDXtyVJqFSSVLkh_GV6Zx6yAyz2-a9kkg8uMhaK4ELr5M71F9v-LhYT6eqCRPDhkn/s400/Cara+Membuat+Blog.jpg" title="Cara Membuat Blog Baru" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Cara Membuat Blog Baru</td></tr>
</tbody></table>
<br />
<br />
<blockquote class="tr_bq">
Sebagai pemula, untuk sekedar buat blog memang agak sedikit membingungan yang pada kenyataan bagi seorang blogger ini merupakan satu langkah yang sangat mudah. Lantas mengapa masih ada kesulitan, yah tentu saja ini akan dipengaruhi oleh faktor pengetahuan tentang cara cara ngeblog. Sehinga kebingungan ini adalah wajar jika pemula masah meraba - raba dan bertanya bagaimana caranya.</blockquote>
<br />
Dalam Artikel ini kita akan membahas tutorial blog, antara lain:<br />
<br />
<ol>
<li>Apa Itu Blog</li>
<li>Perbedaan Blog dan Website ( Situs Web )</li>
<li>Daftar Penyedia Layanan Blog Gratis Terbaik</li>
<li>Cara membuat Blog di Blogger.com (Blogspot)</li>
<li>Cara Membuat Blog di WordPress.com (WP)</li>
</ol>
<div>
<br /></div>
<br />
<h4>
Pertama, Pahamilah apa itu Blog?</h4>
<div>
Sebuah blog dapat digunakan sebagai media publikasi menyampaikan ide,gagasan, informasi atau catatan harian melalui tulisan-tulisan yang di muat dalam posting blog. Sedangkan dijaman teknologi saat ini, beberapa blogger bahkan ada yang membuat blog sebagai sumber penghasilan untuk menghasilkan uang melalui iklan yang terpasang di blog maupun produk yang mereka tawarkan.</div>
<div>
<br /></div>
<div>
Sehingga Blog dapat diartikan sebagai sebuah Aplikasi Web. Halaman blog adalah bagian dari situs website yang dapat diakses secara nirkabeal atau online yang memiliki fungsi utama memuat tulisan-tulisan dan gambar (isi postingan) pada setiap halaman web. Dari segi penggunaannya sebuah Blog dikelola oleh pengguna tunggal / penulis, dan materinya dibuat sesuai dengan topik dan tujuan dari si pengguna blog tersebut. Sebuah blog juga bisa di buat oleh beberapa pengguna dalam satu komunitas. Dimana membuat sebuah blog menjadi miliki bersama dan dengan tujuan bersama.</div>
<div>
<br /></div>
<h4>
Apa perbedaan Blog dan Website ?</h4>
<div>
Terkadang ini menjadi pertanyaan hot bagi pemula yang sering bertanya bagaimana mengertikan antara blog dan webiste?<br />
<br />
Blog itu adalah bagian dari situs web (website). Dengan kata lain, blog itu website, tapi website belum tentu sebuah blog. Ibaratnya, website itu sebuah rumah. Yang namanya rumah, tentu ada kamar-kamar (ruangan), seperti ruang tamu, ruang tidur, dapur, dll. Nah, blog itu ibaranya salah satu kamar (ruangan) dalam rumah (website) itu. Clear? Jadi, ringkasnya, perbedaan antara blog dan website adalah sebuahblog sudah pasti bisa disebutwebsite , karena blog itu bagian dari website. Tapi sebuah website belum tentu disebut blog.<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhXnqiIqeIbsi4KCNHk0dR7c7puZXMUF1-6Glv8GAWHoDhPMKHmp8z0QZ9B8GpA5RDtIhu2jXmbsKMz-CQXbi4-8yOl6-1tK0ub3WDNTqL_G38ciW1big8iavrtTrH4IbHqWTu80EpuAssD/s1600/Cara+Membuat+Blog+-+Perbedaan+Website.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="Cara Membuat Blog - Perbedaan Website" border="0" height="279" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhXnqiIqeIbsi4KCNHk0dR7c7puZXMUF1-6Glv8GAWHoDhPMKHmp8z0QZ9B8GpA5RDtIhu2jXmbsKMz-CQXbi4-8yOl6-1tK0ub3WDNTqL_G38ciW1big8iavrtTrH4IbHqWTu80EpuAssD/s320/Cara+Membuat+Blog+-+Perbedaan+Website.png" title="Cara Membuat Blog - Perbedaan Website" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Cara Membuat Blog - Perbedaan Website/Blog</td></tr>
</tbody></table>
<br />
<br />
Dari segi desain atau tampilan, dalam hal inihomepage, frontpage , beranda, atau tampilan halaman depan, ciri khas atau ciri utama blog adalah urutan tulisan (posting), yaitu dalam“urut terbalik”. Posting terbaru paling atas atau paling depan, diikuti posting lama, meskipun tidak selamanya demikian, khususnya kalo pake template blogmagazine style ataunews style . Website umumnya memiliki tampilan (desain) lebih menarik ketimbang blog dengan menggunakan desain CSS/HTML Template buatan sendiri. Namun demikian, dari segi tampilan, blog dan web sekarang sulit dibedakan karena sama-sama bagus (atau sama-sama jelek?)<br />
<br />
<h4>
Penyedia Layanan Blog Gratis Terbaik</h4>
Sebagai informasi tambahan bahwa Untuk membuat blog kita akan memerlukan server untuk menyimpan file file blog yang akan kita bangun. Tentu saja jika pilihan kita adalah dengan menyediakan server pribadi untuk sekedar blogging saja ini adalah hal yang cukup sulit. Apalagi bagi pemula yang masih dalam tahap belajar untuk membuat blog baru di internet.<br />
<br />
Tapi bukan berarti jalan sudah tertutup dan kita mengurungkan semangat untuk membuat blog yang kita inginkan. Kabar baiknya adalah sekarang ini sudah banyak penyedia layanan blog yang dapat kita manfaatkan untuk membagun kreativitas blogging diinternet. Meskipun tidak semua seutuhnya adalah gratisan, karna ada juga penyedia layanan yang meng-paketkan layanan mereka dengan tarif berbeda beda.<br />
<br />
Berikut ini adalah daftar dari beberapa penyedia layanan blog gratisan yang dapat dijadikan tempat untuk membuat blog secara gratis. Meskipun dalam tanda kutip adalah layanan gratis, daftar layanan blogging dibawah ini sudah berkembang cukup lama dan dipercaya akan kualitas dan performanya, jadi lebih tepatnya "Layanan Gratisan rasa Premium" hehehheehehe. Tenang saja sobat bahkan tanpa <a href="http://blog.fispol.com/2013/03/belajar-HTML.html" target="_blank">Belajar dasar HTML</a> pun anda bisa langsung menerbitkan blog disalah satu layanan dibawah ini.<br />
<br />
<ul>
<li><b>BLOGGER.COM</b> - Blogger atau istilah domain favoritnya Blogspot adalah tempat membuat blog yang paling populer dan sekarang dimiliki oleh Google. Sangat bagus untuk belajar lebih mengenal blogging dengan dashboard sangat ramah dengan pengguna. Anda tinggal daftar akun di google, maka Anda bisa membuat blog gratis. Seperti blog yang anda baca saat ini yang juga merupakan blog berpaltform blogger.</li>
<li><b>WORDPRESS.COM</b> - WordPress.com adalah penyedia hosting juga dan blog gratis milik Automattic favorit banyak penulis. Dengan platform WordPress yang tekenal lebih SEO "kantanya", Anda dapat dengan mudah memilih thema favorit Anda, juga layout blog yang dimudahkan.</li>
<li><b>TUMBLR.COM</b> - Tumblr adalah platform blogging yang paling sederhana dan merupakan blogging platform mikro termudah. Hanya butuh waktu 1 menit untuk membuatnya untuk kemudian mulai ngeblog. Tumblr menjadi platform yang menyenangkan karena mempunyai halaman timeline mirip twitter, kita bisa mengfollow akun blog lain agar postingannya bisa tampil di timeline kita. Kita bisa memposting artikel, quote, gambar, video, chat, dan musik di tumblr dengan mudah.</li>
<li><b>LIVEJOURNAL.COM</b> - Penyedia blog yang satu ini juga cukup besar penggunanya di seluruh media oleh sebab itu masuk dalam penyedia blog gratis kali ini, walau begitu live journal memiliki fungsi yang lebih identik dengan webbly dan tumblr dibandingkan blogger dan wordpress. Akan tetapi live journal juga merupakan salah satu blog yang baik untuk membangun blog pribadi maupun dummy blog anda yang tentunya gratis.</li>
</ul>
<div>
<br /></div>
<div>
Daftar diatas hanyalah sebagian kecil dari penyedia layanan blog gratis, masih ada banyak penyedia layanan lainnya yang juga bisa dijadikan tempat untuk membuat blog. Hanya saja penulis menampilkan referensi terbaik saja yang sudah penulis coba sehingga sahabat blogger dapat memilih sendiri yang mana tempat untuk membuat blog pilihan pembaca sendiri.</div>
<div>
<br /></div>
<h4>
Cara membuat Blog di Blogger.com</h4>
</div>
Untuk membuat Membuat Blog di blogger.com saat ini sangat Mudah dan Cepat, semua bisa didapatkan dengan gratis. Artikel kali ini saya khususkan bagi sobat yang benar benar awam mengenai cara membuat blog gratis, jadi bagi sobat yang sudah memahami dan menguasai ilmu cara membuat blog abaikan saja artikel ini. Baca Selengkapnya pada artikel <a href="http://blog.fispol.com/2012/12/cara-membuat-blog-gratis-di-blogspot.html" target="_blank">cara membuat blog blogger</a>.<br />
<div>
<br /></div>
<table cellpadding="0" cellspacing="0" class="tr-caption-container" style="float: left; margin-right: 1em; text-align: left;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhTAw2WXrNlw3ItvIxK09XJdjJMzDrk4jMUruO8D23FS7FCnGVae8d7S2vFZoJ7_IAT4LOoUNFCoO12TNPFmah6VZB6pGtBMsPnEXJJ26CYDR6z_f-jvrs1wIHa5gAG0vc_LUEtc9gDYchP/s1600/Cara+membuat+Blogger.png" imageanchor="1" style="clear: left; margin-bottom: 1em; margin-left: auto; margin-right: auto;"><img alt="Cara membuat Blogger" border="0" height="84" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhTAw2WXrNlw3ItvIxK09XJdjJMzDrk4jMUruO8D23FS7FCnGVae8d7S2vFZoJ7_IAT4LOoUNFCoO12TNPFmah6VZB6pGtBMsPnEXJJ26CYDR6z_f-jvrs1wIHa5gAG0vc_LUEtc9gDYchP/s320/Cara+membuat+Blogger.png" title="Cara membuat Blogger" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Cara membuat Blogger</td></tr>
</tbody></table>
<div>
Penulis bukan tidak mau menjelaskan tutorial lengkapnya diartikel ini, tapi berhubung karna cara membuat blog berplatform blogger sudah ada diartikel sebelumnya, jadi pembaca bisa menemukan langkah dan cara cara memulai blog blogspot anda pada artikel tersebut.</div>
<div>
<br /></div>
<h4>
</h4>
<h4>
Cara membuat Blog di WordPress.com</h4>
<div>
Sama hanya dengan blogger, untuk membuat blog di WordPress juga tidak ada masalah dan pekerjaan berat yang harus dilakukan. Kita hanya akan perlu mengisi formulir pendaftaran blog baru di situs wordpress.com dan mengikuti step by step ke langkah-langkah membuat blog selanjutnya.</div>
<div>
<br /></div>
<table cellpadding="0" cellspacing="0" class="tr-caption-container" style="float: left; margin-right: 1em; text-align: left;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjg_JorNcGj0kJ3R1UtLjHWmFnsAdneGjW63S1OgPEN7EMSjNTHWuMRe5ZfptoDAEuFCNU8fQPcfnbGbaFPiMfBxi0ahAAg8oVSiLs_PV7EeKCAGDU95fusgXnfRZ2L7oQunhxpfyoxkhN1/s1600/Cara+Membuat+WordPress.png" imageanchor="1" style="clear: left; margin-bottom: 1em; margin-left: auto; margin-right: auto;"><img alt="Cara Membuat WordPress" border="0" height="72" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjg_JorNcGj0kJ3R1UtLjHWmFnsAdneGjW63S1OgPEN7EMSjNTHWuMRe5ZfptoDAEuFCNU8fQPcfnbGbaFPiMfBxi0ahAAg8oVSiLs_PV7EeKCAGDU95fusgXnfRZ2L7oQunhxpfyoxkhN1/s320/Cara+Membuat+WordPress.png" title="Cara Membuat WordPress" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Cara Membuat WordPress</td></tr>
</tbody></table>
<div>
Silahkan baca artikel saya sebelumnya tentang <a href="http://blog.fispol.com/2012/12/cara-membuat-blog-gratis-di-wordpress.html" target="_blank">cara membuat blog gratis di wordpress</a> untuk mendapatkan tutorial, cara dan langkah lebih mendetail untuk memulai blog baru </div>
<div>
di WordPress.com ini.</div>
<div>
<br /></div>
<div>
<br /></div>
<div>
Nah bagi anda yang telah berhasil dengan menerapkan cara membuat blog ini, jangan lupa untuk share pengalaman anda bersama penulis dikotak komentar. Kiranya dengan berbagi kisah akan tercipta satu kebersamaan, terutama menciptakan rasa sosial antar blogger tanah air. </div>
<div>
<br /></div>
<div>
Selamat membuat blog baru, dan maju terus blogger indonesia.</div>
<div>
<br />
<div>
<br /></div>
</div>
Unknownnoreply@blogger.com19tag:blogger.com,1999:blog-997877103022851878.post-29687892161418925662016-11-05T11:56:00.004+07:002017-06-25T12:06:55.358+07:00Lowongan Kerja Untuk Dijadikan Penulis blog freelance<b>Menulis</b> adalah pekerjaan yang sangat mudah yang bisa dilakukan dimana saja dan kapan saja, siapapun bisa melakukannya. Namun menulis yang efektif tidak hanya sekedar memberi bacaan bagi pengguna atau hanya untuk hobby saja, tapi juga sebagai profesi pro untuk mendapatkan hasil yang bisa disebut sebagai pendapatan berupa uang.<br />
<a name='more'></a><br />
<br />
Hingga hari ini mungkin saja anda sudah lelah mencari keseluruh penjuru <b>bagaimana mendapatkan uang dengan menulis</b>, dan anda akan semakin tidak percaya itu benar benar bisa setelah anda kehabisan ide dan bersaing dengan para penulis aktif yang sudah memiliki buku buku mereka sendiri.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjISujbEnX-ns5Oa2QPC9vIki-Koq9OJ5VmMXTGD3eQNXUfru-RQM7VTSQ8o0gj0r7wcjZ_SacDfcgDz7nHANy9fPOVoO8EvjY3oJPrxFFaePUO1W-VQ_1S4VhyphenhyphenOWFWpN-_7_D9cqqgygRA/s1600/Lowongan+kerja+Penulis.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Lowongan kerja Untuk Menulis" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjISujbEnX-ns5Oa2QPC9vIki-Koq9OJ5VmMXTGD3eQNXUfru-RQM7VTSQ8o0gj0r7wcjZ_SacDfcgDz7nHANy9fPOVoO8EvjY3oJPrxFFaePUO1W-VQ_1S4VhyphenhyphenOWFWpN-_7_D9cqqgygRA/s1600/Lowongan+kerja+Penulis.jpg" title="Lowongan kerja Untuk Menulis" /></a></div>
<span id="goog_1656584582"></span><span id="goog_1656584583"></span><br />
<br />
Lalu Bagaimana jika itu bisa anda jadikan nyata? Anda <u>menulis artikel</u> dan semua tulisan anda akan diberi harga setimpal sehingga tidak menjadi sia-sia sebagai tanda jasa akan upaya kerja keras yang telah anda lakukan itu. Hari ini anda beruntung, karena saya akan sedikit berbagi bocoran pada anda tentang lowongan bagi penulis artikel, baik untuk profesional maupun pemula, semua bisa bekerja menjadi penulis dan memiliki penghasilan atas kerja kerasnya.<br />
<br />
Baru baru ini saya mendapatkan informasi ini, bahwa sebuah perusahaan yang bergerak dibidang telokomunikasi dan bisnis sedang membuka lowongan pekerjaan yang terbuka bagi semua orang dengan hanya mengandalkan kemampuan menulisnya. Kabar baiknya, tidak ada pembatasan gelar, pengalaman untuk memulai bekerja, Sehingga anda tidak akan perlu lulus strata apapun untuk bergabung, anda hanya perlu minat kerja, niat dan terus belajar untuk menulis menjdai lebih baik. Ini akan sekaligus menjadi sebuah tempat anda mengasah kemampuan menulis anda sendiri untuk bermain sambil belajar !<br />
<br />
<b>Lowongan Kera Untuk Penulis Artikel</b><br />
<br />
<b>Kriteria Yang dibutuhkan untuk Pekerjaan</b> ini adalah:<br />
<br />
<ul>
<li>Bisa Mengoperasikan Komputer Sebagai Sarana Untuk Menulis</li>
<li>Bisa Bekerja dengan Internet ( Email, Browsing, download, upload, dll )</li>
<li>Bisa menulis sendiri, baik itu dengan ide yang ada maupun ide sendiri</li>
<li>Berkemauan belajar.</li>
</ul>
<div>
<b>Posisi pekerjaan dan Penghasilan</b> :</div>
<div>
<ul>
<li>Sebagai Penulis Tetap dengan Gaji bulan dan Bonus + Tunjangan</li>
<li>Penulis Freelance dengan penghasilan dihitung per artikel</li>
</ul>
<div>
Jadi baik anda Penulis pemula maupun profesional bisa memulai pekerjaan ini tanpa resiko. Anda bisa memilih bagaimana anda berpenghasilan dan bekerja. Sebagai tambahan informasi bahwa untuk menjadi penulis tetap, anda kan menjalani masa trainning selama durasi yang tetapkan oleh perusahaan, sehingga pada masa percobaan anda akan banyak ditempatkan untuk lebih banyak belajar. Semakin anda belajar lebih baik, makan anda akan mendapatkan posisi dan penghasilan yang semakin baik pula.</div>
</div>
<div>
<br /></div>
<div>
Bagi anda yang serius untuk dengan lowongan kerja menjadi penulis ini bisa langsung menghubungi pihak resmi di www.harazakida.com atau melalui email info@harazaki.co. Sertakan detail anda selengkapnya pada saat mensubmit lamaran anda.</div>
<div>
<br /></div>
<div>
Selamat mencoba, ... Salam Blogger Indonesia !</div>
Unknownnoreply@blogger.com7tag:blogger.com,1999:blog-997877103022851878.post-31083556643710709232016-11-03T23:01:00.000+07:002017-06-25T12:07:50.833+07:00Menghadapi Komentar Spam Di bloggerMalam ini adalah hari dimana saya tiba tiba teringat blog ini lagi setelah cuti sejak tahun lalu, nggak terasa ya teman teman :) disini sudah makin rame. Meskipun blog ini sudah jarang diurus alias yatim piatu 'woowkwoowkkwo' tapi tetap saja ada yang berkenan datang ke blog ini. Yasudahlah, harusnya ini adalah kabar baik bagi saya, iya kan?<br />
<a name='more'></a><br />
<br />
Hmm... Tapi ada satu hal yang membuat saya syalut yaitu kotak komentar yang sudah sangat banyak, entah dari mana datangnya. Mungkin dari langit kali ya? hahahhaha. Tapi iya bener komentar yang gak jelaspun sangat banyak tak terhitung. Sudah kuduga, mana mungkin manusia biasa bisa sebanyak itu berkomentar di blog ini jika itu bukanlah mesin spam atau semacamnya.<br />
<br />
<h4>
Saya ingin Komentar Blog Sebanyak Banyaknya</h4>
Ya waktu itu kan blog masih sepi nih ya, so saya berpikir gini 'Gimana caranya supaya blog ini kelihatan ramai pengunjungnya? ' WOOOOW .... Gimana ya? Nah kenapa tidak saya rubah pengaturan blog nya untuk membiarkan siapa saja berkomentar. Tidak perlu verifikasi spam, tidak perlu masuk, tidak perlu identitas, Yang penting komentarnya banyak.<br />
<br />
Dan hari ini terbukti kan? banyak buanget komentarnya. Saking banyaknya nih, ada jin, tuyul dan kawan kawannya. Kadang komentarya gak nyambung bahkan ada yang kepanjangan yang menyebabkan pengguna jadi tidak dapat menikmati blog ini sebagaimana mestinya.<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQ-AZh6DpGMX9hoEYY4HhUfst_6L3inWHqTJRptKSBM_yvG-3vXJsF5HAvlS9OjMV1FlkUSxmGiKWIAJlKrK8x6ja_cZA3vOYGdSo1wH2E0r4x_jLFjQPKZNdu8zod18mFXQLZU1I2RHTh/s1600/Komentar+Spam+Blogger.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="Komentar Spam Blogger" border="0" height="206" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQ-AZh6DpGMX9hoEYY4HhUfst_6L3inWHqTJRptKSBM_yvG-3vXJsF5HAvlS9OjMV1FlkUSxmGiKWIAJlKrK8x6ja_cZA3vOYGdSo1wH2E0r4x_jLFjQPKZNdu8zod18mFXQLZU1I2RHTh/s320/Komentar+Spam+Blogger.png" title="Komentar Spam Blogger" width="320" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Komentar Spam</td></tr>
</tbody></table>
Akibatnya saya jadi kewalahan sendiri untuk menghapus koment koment spam ini, meskipun bisa saja menghapus massal tapi tetap saja kan harus memilah juga, karna sebagian ada komentar manusia yang tidak perlu dihapus.<br />
<div>
<br /></div>
<h4>
Menjadikan Kotak Komentar Bersih Efektif</h4>
<div>
Nah ini menjadi pengalaman berharga bagi blogger pemula seperti saya, dalam hal komentar diblog itu bukan tenatng ramainya saja tetapi itu juga harus tetap menjadi bermanfaat bagi artikel untuk menghindari user spam di kotak komentar.</div>
<div>
<br /></div>
<div>
Oleh sebab itu, untuk menghadapi komentar spam tidak berulang kedepan dibutuhkan seleksi yang tepat yaitu dengan mengubah pengaturan berdiskusi di blog kita:</div>
<div>
<br /></div>
<div>
<ol>
<li>Dari dashboard blogger, Masuk ke Pengaturan</li>
<li>Plih 'Post, Komentar, dan Berbagi'</li>
<li>Lalu ubah pengaturan ke pilihan harus masuk, jika perlu masuk ke akun google atau menggunakan open id</li>
</ol>
</div>
<div>
<br /></div>
<div>
Dengan demikian saya berharap kedepan kotak komentar diblog akan lebih efektif bagi pengunjung dan tidak ada lagi komentara spam, iklan, dkk yang dapat merusak artikel kita di blog. Amin</div>
<div>
<br />
<br /></div>
Unknownnoreply@blogger.com2tag:blogger.com,1999:blog-997877103022851878.post-15001986062354470142014-07-08T00:00:00.000+07:002017-06-25T12:08:19.387+07:00Cara Mencegah, Disable Klik kanan & Menyembunyikan View Source<i><span style="font-size: x-small;">Tips Trik Blog - JAVASCRIPT - BAGAIMANA CARA MENDISABLE KLIK KANAN ATAU MENCEGAH COPY PASTE?</span></i><br />
<br />
Selamat Malam Netter yang ganteng, cakep dan cantik :)... Nggak tahu ya dah berapa lama nih nggak nulis di blog ini :V. Pokok'e dah lama dah mungkin setahun kali ya? dan kali ini mau lewat bentar sekalian buat sharing beberapa ilmu yang semoga dapat menjadi manfaat bagi sobat netters yang saya cintai.<br />
<br />
<a name='more'></a><br /><br />
Butuh waktu beberapa menit untuk menentukan judul artikel ini. Pertama saya mencoba memberi judulnya sebagai "<b>Cara agar blog tidak di copy paste</b>" lalu ganti lagi jadi "<u>bagaimana cara mencegah klik kanan</u> di website" dan seterusnya berhenti pada judul diatas. Hal ini mungkin karena artikel ini memang mencakup semua pertanyaan tersebut, yaitu :<br />
<table cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><img alt="MENCEGAH KLIK KANAN - MENYEMBUKAN SOURCE KODE" border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEghFZ0ZbwWyDKE89-772xiJju-uRA0J2dVgEC24gTO7InGB0KxEJgVz-UwV0wL9XRfv6JUx7ERo_Y1BqTTLfJtApBbt-PL4PsdfM2tl5w5Ja4s7lOmKHvz1FJrSSUnjForwv5HCSd9K1nCD/s1600/Mencegah+Klik+kanan.jpg" style="margin-left: auto; margin-right: auto;" title="MENCEGAH KLIK KANAN - MENYEMBUKAN SOURCE KODE" width="320" /></td></tr>
<tr><td class="tr-caption" style="text-align: center;">ANTI KLIK KANAN</td></tr>
</tbody></table>
<br />
<ul>
<li><a href="http://blog.fispol.com/2014/07/cara-mencegah-klik-kanan-menyembunyikan-source-kode.html">Cara Mencegah atau Disable Klik Kanan</a></li>
<li><a href="http://blog.fispol.com/2014/07/cara-mencegah-klik-kanan-menyembunyikan-source-kode.html">Menyembunyikan Kode</a> Sumber halaman / Hide Source Kode</li>
<li><a href="http://blog.fispol.com/2014/07/cara-mencegah-klik-kanan-menyembunyikan-source-kode.html">Mencegah CTRL + U dan HOT KEYS lainnya</a>.</li>
</ul>
<h4>
MENCEGAH KLIK KANAN</h4>
Seseorang membatasi aksi klik kanan pada web atau blog biasanya dengan tujuan agar website tidak disalin oleh sembarang orang, apalagi jika konten website pada halaman dimaksud adalah berisi file - file berlisensi dan mahal harganya. Sehingga Dalam hal ini kita harus membatasi aksi klik kanan yang biasanya dilakukan oleh para penyerang. <i>Menarik bukan</i>? ayooo mari kita mainkan saja :D... Namun jangan buru-buru ya... kita melangkah step by step biar lebih asyik !!! dan agar artikel ini dipandang baik oleh mesin pencari, maka kita akan melakukan beberapa perulangan kata kunci <b>Klik Kanan</b> serta disable <u>source kode</u>.Terima kasih atas pengertian anda dan semoga tidak membosankan :).<br />
<br />
<h4>
DISABLE KLIK KANAN ( COPY PASTE)</h4>
Melarang pengunjung web melakukan copy paste sama halnya dengan disable klik kanan pada mouse. Klik kanan tidak hanya dilakukan saat browsing di dekstop namun pada perangkat nan canggih hal ini mungkin saja dapat dilakukan. Pada artikel ini semua cara - cara tersebut akan anda dapatkan.<br />
<div>
<br />
<h4>
MENYEMBUNYIKAN SOURCE HTML (kode Sumber)</h4>
<br />
Nah ini dia yang paling penting, dari semua tutorial yang saya temukan membahas tentang mencegah klik kanan dsb... namun hal ini tidak disadari bahwa walaupun kita telah melarang dan klik kanan telah di disabled, nyatanya source kode masih bisa dilihat oleh pengunjung web. Otomatis dengan Melihat Source Kode output HTML, copy paste bisa dengan mudah dillakukan bukan? Oleh sebab itu artikel ini adalah solusi untuk menemukan cara terbaik dan benar untuk benar2 mengamankan isi website (output HTML) agar tidak terlihat dan ditampilkan dalam mode sangat aman.<br />
<br />
<h3 class="pembatas">
ANTI KLIK KANAN - SP_TILANG v 1</h3>
<br />
<b>Apa itu SP_TILANG</b>?<br />
<br />
SP_Tilang adalah suatu fungsi Java script yang membantu anda untuk mencegah aktivitas klik kanan oleh pengunjung pada halaman web atau blog. Istimewanya adalah Tidak hanya untuk disabled klik kanan namun juga sekaligus menyembunyikan source kode web blog anda dari browser pengunjung Termasuk Mencegah Fungsi tombol alternatif yang biasa dilakukan oleh pengguna seperti : CTRL + U, CTRL + S dan lain sebagainya.<br />
<br />
Untuk Melihat DEMO bagaimana funsi dari Disabled Klik kanan ini bekerja, silahkan lihat di <a href="http://sptilang.appspot.com/" rel="nofollow" target="_blank">http://sptilang.appspot.com</a><br />
<br />
Anda mungkin bertanya:<span style="color: red;"> Mengapa diblog ini disabled klik kanan tidak kami terapkan</span>?<br />
Jawab : Agar anda bisa mencopy artikel untuk belajar :D hehhehe.<br />
<br />
Fitur Spesifikasi serta informasi kontributor selengkapnya bisa anda dapatkan dari halaman project ini digithub --> <a href="https://github.com/septyaman/SP_TILANG" rel="nofollow" target="_blank">https://github.com/septyaman/SP_TILANG</a><br />
<br />
Sp_Tilang adalah Open Source Yang <u>direkomendasikan</u>, Mengapa?<br />
<br />
Script ini diciptakan pada mode aman dan bersifat open source, Motivasi saya terlahir ketika menyaksikan tutorial tetangga yang sepertinya membawa user ketempat yang suram. Menciptakan script berbahaya yang disertai link - link berbahaya, dimana suatu saat dapat membahayakan para pengguna. untuk mengetahui ini memang seharusnya butuh ketelitian, apalagi jika source nya telah di enkripsi pasti kita tidak akan sadar bahwa didalamnya terdapat hal2 busuk.<br />
<br />
Kami merasa perlu memberi manfaat dari pengetahuan yang kami ketahui dengan cara yang benar dan ikhlas. Balallalala... bingung mau bilang apa lagi pokoknya... Sptilang ini berfitur :<br />
<br />
CEPAT, RINGAN, AMAN dan GRATIS untuk Siapa saja !<br />
<br />
<h3 class="pembatas">
BAGAIMANA CARA MENGGUNAKANNYA</h3>
<br />
<b><u>CARA 1</u></b>. (Hosting File)<br />
<br />
Untuk menggunakannya, dan membuat script pencegah klik kanan atau penyembunyi source kode ini berfungsi, silahkan download file masternya di <a href="https://github.com/septyaman/SP_TILANG/archive/master.zip" rel="nofollow" target="_blank">https://github.com/septyaman/SP_TILANG/archive/master.zip</a>, selanjutnya pada website blog anda panggil sp tilang seperti contoh berikut:<br />
<br />
<pre style="background-color: #f8f8f8; border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; border-top-left-radius: 3px; border-top-right-radius: 3px; border: 1px solid rgb(221, 221, 221); box-sizing: border-box; color: #333333; font-family: Consolas, 'Liberation Mono', Menlo, Courier, monospace; font-size: 13px; line-height: 19px; margin-bottom: 15px; margin-top: 15px; overflow: auto; padding: 6px 10px; word-wrap: normal;"><code style="background: transparent; border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; border-top-left-radius: 3px; border-top-right-radius: 3px; border: none; box-sizing: border-box; display: inline; font-family: Consolas, 'Liberation Mono', Menlo, Courier, monospace; font-size: 12px; line-height: inherit; margin: 0px; padding: 0px; word-wrap: normal;"><script type="text/javascript"> var SPklikkanan = 'TILANG';</script> <script type="text/javascript" src="js/sp_tilang.js"></script></code></pre>
<br />
Anda bisa meletakkannya di diantara tag <span style="color: red;"><head> ..</head></span> atau tag setelah <span style="color: red;"><body></span>...<br />
<br />
<br />
<b><u>CARA 2</u></b>. ( Hosting Google)<br />
<br />
Saya lebih merekomendasikan cara kedua ini Jika anda tidak mau repot, maka sebaiknya menggunakan file yang dihost digoogle saja. Sehingga anda tidak perlu mendownload file apapun. Selain itu, anda tidak perlu repot untuk update jika tersedia versi baru karna semua otomatis akan bekerja ketika kami mengupdate file tersebut. Cukup tambahkan script dibawah ini untuk menggunakan cara ini:<br />
<br />
<pre style="background-color: #f8f8f8; border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; border-top-left-radius: 3px; border-top-right-radius: 3px; border: 1px solid rgb(221, 221, 221); box-sizing: border-box; color: #333333; font-family: Consolas, 'Liberation Mono', Menlo, Courier, monospace; font-size: 13px; line-height: 19px; margin-bottom: 15px; margin-top: 15px; overflow: auto; padding: 6px 10px; word-wrap: normal;"><code style="background: transparent; border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; border-top-left-radius: 3px; border-top-right-radius: 3px; border: none; box-sizing: border-box; display: inline; font-family: Consolas, 'Liberation Mono', Menlo, Courier, monospace; font-size: 12px; line-height: inherit; margin: 0px; padding: 0px; word-wrap: normal;"><script type="text/javascript"> var SPklikkanan = 'TILANG';</script> <script type="text/javascript" src="https://googledrive.com/host/0B6KVua7D2SLCNDN2RW1ORmhZRWs/sp_tilang.js"></script></code></pre>
<br />
Anda bisa meletakkannya di diantara tag <span style="color: red;"><head> ..</head></span> atau tag setelah <span style="color: red;"><body></span>... atau dimanapun anda suka :D<br />
<br />
Untuk mencobanya, silahkan <u>klik kanan</u> pada website anda ... dijamin pasti berhasil 100%.<br />
<br />
<h3 class="pembatas">
Disabled Klik kanan Khusus Untuk Blogger.com</h3>
<br />
Lalu bagaimana menerapkannya diblog versi blogger.com? apakah script ini dapat bekerja?<br />
tentu saja... ini bahkan bisa lebih mudah.<br />
<br />
Masuk ke Menu "<b>TATA LETAK</b>" Lalu Pilih <b>tambahkan Widget ---> HTML/JAVACRIPT </b>lalu pastekan dan simpan sorce dibawah ini<br />
<b><br /></b>
<br />
<pre style="background-color: #f8f8f8; border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; border-top-left-radius: 3px; border-top-right-radius: 3px; border: 1px solid rgb(221, 221, 221); box-sizing: border-box; color: #333333; font-family: Consolas, 'Liberation Mono', Menlo, Courier, monospace; font-size: 13px; line-height: 19px; margin-bottom: 15px; margin-top: 15px; overflow: auto; padding: 6px 10px; word-wrap: normal;"><code style="background: transparent; border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; border-top-left-radius: 3px; border-top-right-radius: 3px; border: none; box-sizing: border-box; display: inline; font-family: Consolas, 'Liberation Mono', Menlo, Courier, monospace; font-size: 12px; line-height: inherit; margin: 0px; padding: 0px; word-wrap: normal;"><script type="text/javascript"> var SPklikkanan = 'TILANG';</script> <script type="text/javascript" src="https://googledrive.com/host/0B6KVua7D2SLCNDN2RW1ORmhZRWs/sp_tilang.js"></script></code></pre>
Atau anda juga langsung menambahkannya kedalam file xml template blog, masuk ke template dan edit, letakkan sebaiknya setelah tag <span style="color: red;"><head></span>.<br />
<br />
<h3 class="pembatas">
PENUTUP</h3>
<div style="text-align: center;">
<b>SEMOGA BERMANFAAT !!!</b></div>
</div>
Vomhttp://www.blogger.com/profile/00316050614670850757noreply@blogger.com130tag:blogger.com,1999:blog-997877103022851878.post-794103643615846342014-04-28T18:12:00.000+07:002017-06-25T12:11:26.368+07:00BAB 1. MENGENAL WWW (WORD WIDE WEB)<span style="background-color: white; border: 0px; font-family: "trebuchet ms" , "arial" , "tahoma" , "century gothic" , sans-serif; font-size: xx-small; line-height: 24px; margin: 0px; outline: 0px; padding: 0px; vertical-align: baseline;"><a href="http://blog.fispol.com/2013/09/panduan-tutorial-dasar-belajar-web-html-website-untuk-pemula.html" target="_blank">TUTORIAL DASAR PEMOGRAMAN DENGAN HTML UNTUK PEMULA MENUJU PEMOGRAMAN WEB YANG PROFESIONAL</a>.</span><br />
<h4>
PENDAHULUAN</h4>
Word wide web (www), lebih dikenal dengan istilah web,merupakan salah satu layanan yang didapat oleh pemakai komputer yang terhubung ke internet.<br />
<br />
<a name='more'></a><br /><br />
Web pada awalnya adalah ruang informasi dalam internet, dengan menggunakan teknologi hiperteks, pemakai dituntun untuk menemukan informasi dengan mengikutilink yang disediakan dalam dokumen web yang ditampilkan dalam browser web.<br />
<br />
Kini internet identik dengan web, karena kepopuleran <a href="http://blog.fispol.com/2013/02/tutorial-cara-membuat-website-untuk.html">website</a> sebagai standart interface pada banyak layanan yang ada diinternet, bermula sebagai penyedia informasi, kini internet digunakan juga untuk komunikasi dari email sampai dengan chatting, bahkan untuk transaksi bisnis (commerce).<br />
<br />
Bahkan Saat ini web lebih populer daripada email, walaupun secara statistik email masih merupakan <a href="http://blog.fispol.com/2013/05/software-aplikasi-pembuat-website-desain-web.html">aplikasi</a> terbanyak yang digunakan oleh pengguna internet. <a href="http://blog.fispol.com/2012/12/kunci-penting-membuat-website-blog.html">Web</a> lebih populer bagi khalayak umum dan pemula, terutama untuk tujuan pencarian informasi dan melakukan komunikasi e-mail yang menggunakan web sebagai interfacenya.<br />
<br />
Web memudahkan pengguna komputer untuk berinterkasi dengan pelaku internet lainnya dan menelusuri (informasi) dinternet.<br />
<br />
Selain itu web telah diadopsi oleh perusahaan sebagai sebagaian dan startegi teknologi informasinya, karena beberapa alasan, Misalnya:<br />
<ul>
<li>Mengakses Informasi Mudah</li>
<li>Pengaturan Servet Lebih Mudah</li>
<li>Informasi Mudah didistribusikan</li>
<li>Bebas Paltform; Informasi dapat disajikan oleh browser web pada sestem operasi mana saja karena adanya standart dokumen berbagai tipe data dapat disajikan.</li>
</ul>
<br />Unknownnoreply@blogger.com10tag:blogger.com,1999:blog-997877103022851878.post-71222747298261543622013-09-24T22:42:00.000+07:002017-06-25T12:11:01.637+07:00TUTORIAL DASAR PEMOGRAMAN WEB DENGAN HTML MENUJU PEMOGRAMAN PROFESIONAL.<span style="font-size: x-small;">TUTORIAL DASAR PEMOGRAMAN DENGAN HTML UNTUK PEMULA MENUJU PEMOGRAMAN WEB YANG PROFESIONAL.</span><br />
<h4>
Tutorial ini akan disertai dari<span style="color: red;"> 200 lebih</span> contoh <u>program web</u> beserta tampilan grafisnya.</h4>
<span style="background-color: #f3f3f3;">Penulis Pembimbing : <span style="color: blue;">MR. Firman Tel.</span></span><br />
<span style="background-color: #f3f3f3;">Penulis Utama: <span style="color: blue;">Septyaman vom</span>, dan seluruh <span style="color: blue;">Jwp Team</span></span><br />
<span style="background-color: #f3f3f3;">Sponsor : <i>Hosting Pusat, kepulauannias.com</i></span><br />
<span style="background-color: #f3f3f3;">Info Kontribusi : <a href="mailto:team@jasawebsiteprofesional.com" rel="nofollow" target="_blank">team@jasawebsiteprofesional.com</a></span><br />
<br />
<br />
HI sobat netters semua, kali ini kami akan membuka bab baru yang kiranya dapat bermanfaat bagi teman-teman yang juga sedang belajar program web. Berhubung waktu kami pada bulan ini memungkinkan, *walaupun terbatas namun semoga saja beberapa halaman akan ditulis untuk teman-teman semua.<br />
<br />
Latar belakang tidak lain adalah dimana terlihat jelas bahwa kemajuan teknologi unternet / intranet yang kini semakin cepat, karena itu sebagai bagian dari masyarakat IT di Indonesia perlu ikiranya kami turut campurdalam membantu percepatan perkembangan ini. Dan walaupun demikian kami tidak menutup mata bahwa sajian atau tutorial ini akan memiliki banyak kekuranagan. Karena itu, sebagai penulis kami membutuhkan masukan dari rekan-rekan netters semua, rekan pelajar, mahasiswa dan siapapun yang sedang bermain dalam turorial ini khususnya yang tertarik dalam mempelajari <b><u>Pemograman WEB</u></b> yang menggunakan <i>ASP</i> sebagai Teknologi Utama.<br />
<br />
Harapan kami semoga <i>tutorial</i> ini akan dapat kami update dan secepat mungkin dan menyelesaikannya. Mudah-mudahan dengan adanya tutorial ni. akan lebih banyak lagi perkembangan dalam Implementasi aplikasi berbasis web di Indonesia.<br />
<br />
Apa saja yang akan dipelajari dalam topik "<a href="http://blog.fispol.com/2013/09/panduan-tutorial-dasar-belajar-web-html-website-untuk-pemula.html" target="_blank">TUTORIAL DASAR PEMOGRAMAN DENGAN HTML MENUJUN PEMOGRAMAN PROFESIONAL</a>" ini? yaitu, dapat diuraikan sebagai berikut:<br />
<br />
<h4>
1. MENGENAL WWW (WORD WIDE WIB)</h4>
Pendahuluan...<br />
1.a Sejarah Web<br />
1.b Word Wide Web Consortium W3c<br />
1.c Bagaimana WWW BEKERJA?<br />
1.d Browser WEB Bagaiamana Browser Mengambil halaman?<br />
1.e Proses Broses Menampilkan Halaman Website<br />
1.f Mengenal Server Web<br />
1.g Isitilah-istilah Penting...<br />
<br />
<h4>
2. Berkenalan dengan HTML</h4>
2.a Apa itu Dokumen HTML?<br />
2.b Menanam Dokumen<br />
2.c Definisi Elemen<br />
2.d Definisi Tag<br />
2.e ELEMEN HTML yang dibutuhkan untuk belajar<br />
2.f Penjelasan contoh<br />
2.g Petunjuk untuk menggunakan Tag<br />
2.h Atribut Tag<br />
2.i Tips Trik Mudah belajar Melalui Source HTML<br />
2.j Menjawab pertanyaan Pemula<br />
<br />
<h4>
3. Tag-tag Dasar HTML</h4>
3.a HTML<br />
3.b Head<br />
3.c Title<br />
3.d Body<br />
3.e Paragraf<br />
3.f Line Break<br />
3.g Heading<br />
3.h Mengatur Letak Heading<br />
3.i Penggaris Mendatar<br />
3.j Komentar<br />
3.k Tag-tag dasar HTML<br />
3.l Catatan Tips Yang Berguna<br />
<br />
<h4>
4. Format Teks HTML</h4>
4.a ...*<br />
4.b ...*<br />
4.c ...*<br />
4.d ...*<br />
4.f ...*<br />
4.g ...*<br />
4.h ...*<br />
4.i ...*<br />
4.j ...*<br />
4.k ...*<br />
4.l ...*<br />
<br />
<h4>
Dan selanjutnya Hingga...---> Total <span style="color: blue;">38 BAB</span></h4>
<br />
Akan Lampiran :<br />
<br />
<ul>
<li>Contoh HTML News<span id="goog_521347"></span><span id="goog_521348"></span></li>
<li>Lampiran Referensi Entitas HTML 4.0</li>
<li>Acuan HTML 4.01 Lengkap (Alphabetical Order)</li>
<li>Sound + Fungsi Khusus</li>
</ul>
<br />
<br />
Nantikan Kami pada masa mendatang... <a href="http://www.blogger.com/follow-blog.g?blogID=997877103022851878" rel="nofollow" target="_blank">Klik disini</a> untuk mendapatkan updatenya (Khusus Pengguna google). baca juga <a href="http://www.fispol.com/cara-baru-membuat-akun-email-gmail-yahoo/">cara membuat email</a> bagi yang belum memiliki email.<br />
<div>
<br /></div>
Unknownnoreply@blogger.com140tag:blogger.com,1999:blog-997877103022851878.post-668565531011318922013-09-02T18:30:00.000+07:002017-06-25T12:12:39.627+07:00Bagaimana Cara mengatur Featured Image atau gambar istimewa WordPress?Gambar yang ditampilkan juga dikenal sebagai post thumbnail adalah fitur populer di tema WordPress. Hari ini sebagian besar tema WordPress fotografi, tema restoran, tema gereja, dan jenis-jenis tema memiliki dukungan built-in untuk posting thumbnail.<br />
<a name='more'></a><br />
<br />
Dalam artikel ini kita akan menunjukkan cara untuk menambahkan gambar Istimewa tersebut (bukan Membuat system thumbnail di WordPress). Anda mungkin berpikir mengapa kita menggunakan gambar fitur ?. Nah, ketika fitur ini pertama kali diperkenalkan di WordPress 2.9, itu disebut post thumbnail. Namun, dalam versi berikutnya namanya diubah menjadi gambar fitur.<br />
<br />
Gambar Istimewa ini mungkin akan digunakan sebagai thumbnail atau banyak juga yang memanfaatkannya sebagai bahan slider. Okey, tanpa panjang lebar, Cek Out This Bro Sist :<br />
<br />
<div style="text-align: center;">
Dari Halaman Editor Post, Perhatikan Gambar dibawah ini Untuk Menambahkan Sebuah gambar sebagai "Featured Image"<br />
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<img alt="Mengatur atau Menambahkan Featured Image Wordpress" border="0" height="640" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh2mNmgb0MTX77_F8KCcii_2aEJMTym1bmTr8RTPv55mSOlB7Qbrmw5_s-w_thLBaq6lmVOcUMOKuMEA3c2WFppMWl4ULbO2oNP3SiwovHFWSnOIqsgx7koC-jnO_KkwYQy8lxcu0_76TQ6/s640/Mengatur+atau+Menambahkan+Featured+Image+Wordpress.jpg" title="Mengatur atau Menambahkan Featured Image Wordpress" width="582" /></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
lanjut, Kita pilih atau Upload Gambar Yang diiginkan seperti gambar dibawah ini:</div>
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
<img alt="Mengatur atau Menambahkan Featured Image Wordpress 2" border="0" height="316" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiw6Fi3W83NN6dm0pp8RvbeoelJkYDNjrykbB0Xxn3YF7m9xE72Oh-Qz9QJfMR1HvnNRpa5UVhjgoRAlTlEC0m2m-tMZ1SvYJNIRTJWotjVBtdrDYv3QxW18Gk_gBOW6kjEqrCXVcUSQ4gf/s640/Mengatur+atau+Menambahkan+Featured+Image+Wordpress+2.jpg" title="Mengatur atau Menambahkan Featured Image Wordpress 2" width="640" /></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
Bila Berhasil Maka Tampilannya sebagai Berikut :</div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<img alt="Cara mengatur Featured Images atau gambar istimewa WordPress" border="0" height="640" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhbZEgAI31Aj-aUZ18szlLC-ME8o18JtatiCRc_OrTDP6wJLL4c1ncXsX_KV2gkTJtF1ympUXlCnvPSVZc3k8eKdIZhWUr7Z78IJqG8fBQ9oCzMi0a_2mlutB6T5sxcuSiIYLXJnReJPJ_0/s640/Mengatur+atau+Menambahkan+Featured+Image+Wordpress+3.jpg" title="Cara mengatur Featured Images atau gambar istimewa WordPress" width="536" /></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
Okey, Selmat Mencoba... Salam</div>
<br />Unknownnoreply@blogger.com99tag:blogger.com,1999:blog-997877103022851878.post-79512663756651203462013-09-02T17:46:00.001+07:002017-06-26T19:05:01.545+07:00Bagaimana Cara Mengetahui "ID" Post, Kategori, Tag, Komentar, atau Pengguna di WordPressHallo netters..., beberapa hari lalu seorang klien meminta kami untuk membantunya menemukan id postingnya. Ketika anda menggunkan WordPress sebagai manajemen konten anda, mungkin Anda akan perlu untuk menemukan<u> posting ID, kategori ID, atau ID tag</u>.<i> ID adalah nomor unik yang mengidentifikasi item tertentu dalam database WordPress</i>.<br />
<div>
<br /></div>
<div>
Dalam artikel ini kita akan menunjukkan <b>cara untuk menemukan id post / posting, kategori, tag, komentar atau ID pengguna dalam WordPress</b>. Seperti kita ketahui bahwa CMS WordPress menggunakan database MySQL untuk menyimpan dan mengambil data untuk website Anda.</div>
<div>
<br /></div>
<div>
<h3 style="-webkit-box-shadow: rgb(255, 255, 255) 0px 1px 0px inset, rgb(255, 255, 255) 0px 1px 0px; background-color: #ebebeb; border-bottom-color: rgb(186, 186, 186); border-bottom-style: solid; border-top-color: rgb(186, 186, 186); border-top-style: solid; border-width: 1px 0px; box-shadow: rgb(255, 255, 255) 0px 1px 0px inset, rgb(255, 255, 255) 0px 1px 0px; color: #333333; font-family: inherit; font-size: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 23.99305534362793px; margin: 0.25em 0px; outline: 0px; padding: 0.25em 0px; text-align: center; vertical-align: baseline;">
<span style="border: 0px; color: black; font-style: inherit; line-height: normal; margin: 0px; outline: 0px; padding: 0px; vertical-align: baseline;">Bagaimana cara mengetahui ID halaman atau ID poting Wordpress?</span></h3>
</div>
<br />
Cara untuk menemukan posting ID di WordPress adalah : Pertama, Login ke panel admin WordPress Anda, dan klik pada menu Posts. Setelah Anda berada di sana, cukup klik pada Post yang Anda cari. Pos akan terbuka dalam editor, dan Anda akan dapat melihat ID posting atau halaman di address bar browser Anda seperti ini:<br />
<div class="separator" style="clear: both; text-align: center;">
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEisQftIg24UnOFVdjSyLpQN6rke_21o-Jw2P8Yjfc4LhfNQlZ2Wba7mwtrPuePK_DHOj0S9KkYSvYYE9NxCJaghmeJyOMGIS7uZOreCNvfenwkuss1bBzU2ZUCMOwKdNwnvvvjy4cVyXA4Z/s1600/Cara+Menemukan+ID+POsting+ARTikel+Halaman.jpg" /></div>
<div>
<br /></div>
<div>
<h3 style="-webkit-box-shadow: rgb(255, 255, 255) 0px 1px 0px inset, rgb(255, 255, 255) 0px 1px 0px; background-color: #ebebeb; border-bottom-color: rgb(186, 186, 186); border-bottom-style: solid; border-top-color: rgb(186, 186, 186); border-top-style: solid; border-width: 1px 0px; box-shadow: rgb(255, 255, 255) 0px 1px 0px inset, rgb(255, 255, 255) 0px 1px 0px; color: #333333; font-family: inherit; font-size: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 23.99305534362793px; margin: 0.25em 0px; outline: 0px; padding: 0.25em 0px; text-align: center; vertical-align: baseline;">
<span style="border: 0px; color: black; font-style: inherit; line-height: normal; margin: 0px; outline: 0px; padding: 0px; vertical-align: baseline;">Bagaimana cara mengetahui ID Kategori atau ID Tag Wordpress?</span></h3>
</div>
<div>
<span style="border: 0px; margin: 0px; outline: 0px; padding: 0px; text-align: start; vertical-align: baseline;"><br /></span>
<span style="border: 0px; margin: 0px; outline: 0px; padding: 0px; text-align: start; vertical-align: baseline;">Untuk mencari dan Menemukan <b>kategori ID, tag ID atau ID taksonomi kustom</b> lain dalam WordPress hampir sama dengan <a href="http://blog.fispol.com/2013/09/bagaimana-cara-mengetahaui-id-post.html">cara menemukan ID Halaman atau Post</a>. Sebagai contoh, untuk menemukan ID dari kategori, pergi ke Tulisan »Kategori dan klik pada nama kategori. Buka kategori dalam editor, dan Anda akan dapat melihat kategori ID di address bar browser Anda.</span></div>
<div class="separator" style="clear: both; text-align: center;">
<img border="0" height="197" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9l-KSbrJuspTytBCeQyUoSewgvgB065DR_QHx-Pim1sosyK5tgToRufXQqTfgE-VzMHZv-xJOzC0rrnbt9LPfC95aL3h07iQUbV1M7VzW9FKCvvKDT3TZrsLcoJHAf42me32a0dqYQXh2/s640/Cara+Menemukan+ID+Kategoti+dan+Tag+ARTikel+Wordpress.jpg" width="640" /></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div>
Kami berharap artikel ini dapat membantu Anda menemukan posting, kategori, tag, komentar dan ID pengguna dalam WordPress. Jika Anda memiliki pertanyaan atau saran, maka silakan memberikan komentar di bawah ini atau menghubumgi kami melalui tiket pertanyaan.</div>
<div>
<br /></div>
<div>
Salam buat anda dan keluarga...</div>
Unknownnoreply@blogger.com15tag:blogger.com,1999:blog-997877103022851878.post-90847955698397354402013-09-01T22:31:00.000+07:002013-09-01T22:31:32.262+07:00Baru !!! Keyword Tool telah dialihkan menjadi Keyword PLannerTampaknya google kembali mengupdate produknya khusunya "keyword tools" yang selama ini difungsikan sebagai alat untuk menemukan ide pada keyword mesin mesin pencari mereka. Berikut adalah terjemahan dari situs google langsung :<br />
<h3>
<b>Keyword Tool telah beralih ke Keyword Planner (Perencana kata kunci)</b></h3>
<div class="separator" style="clear: both; text-align: center;">
<img alt="Keyword Tool telah beralih ke Keyword Planner (Perencana kata kunci)" border="0" height="258" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhU592rFXnxRM_-gTYk-Y6z-wM0KJTDZ3LjaG3EkWy7gGwe0MAu73lgdH_MIId7XtlitTsYf1ZeAiyaq8-QAwRzMtRRWTqoDecDg2RVVtldGI5uBaK8osCkpBWMImv4MoTdO9wwmSos92Eh/s320/Google-Adwords-keyword-planner.png" title="Keyword Tool telah beralih ke Keyword Planner (Perencana kata kunci)" width="320" /></div>
<div>
<b>Tentang Peralihan Program Keyword tool</b></div>
<div>
<b><br /></b></div>
Dengan Planner Keyword, google telah menggabungkan fungsi Keyword Tool dan Lalu Lintas untuk membuatnya lebih mudah untuk merencanakan kampanye pencarian . Itulah mengapa Keyword Tool tidak tersedia lagi . Anda dapat menggunakan <u>Planner Kata Kunci</u> untuk menemukan kata kunci baru dan ide-ide grup iklan, mendapat taksiran kinerja mereka untuk menemukan tawaran dan anggaran yang tepat untuk Anda , dan kemudian menambahkannya ke kampanye Anda . Kami juga telah menambahkan beberapa fitur baru dengan Planner Keyword .<br />
<br />
<blockquote class="tr_bq">
Perangkat Kata Kunci eksternal juga tidak lagi tersedia. Jika Anda ingin mendapatkan gagasan kata kunci menggunakan Planner Kata Kunci , pastikan untuk masuk ke akun AdWords Anda .<br />Ketika Anda mulai menggunakan Planner Keyword , Anda mungkin akan melihat beberapa perbedaan antara Keyword Planner dan Keyword Tool . Baca terus untuk mengetahui lebih lanjut tentang apa yang telah berubah .</blockquote>
<br />
<b>Tidak ada yang cocok untuk tipe data volume pencarian</b><br />
<br />
Dengan <i>Keyword Tool</i> , kami menunjukkan Anda statistik pencocokan umum secara default dengan kemampuan untuk mendapatkan data untuk jenis pertandingan lain , seperti pencocokan frasa dan tepat . Tetapi dengan Planner Kata Kunci , Anda akan mendapatkan statistik sejarah hanya untuk pertandingan yang tepat . Untuk memutuskan apa yang cocok dengan jenis untuk menggunakan , menambahkan gagasan kata kunci untuk merencanakan dan meninjau perkiraan lalu lintas untuk setiap jenis pencocokan . Perubahan ini akan membantu Anda mendapatkan perkiraan yang akurat tentang berapa banyak lalu lintas yang dapat Anda harapkan untuk mendapatkan dengan jenis pencocokan yang berbeda . Ada cukup banyak tumpang tindih antara kata kunci pencocokan luas dan frase , dan pencarian statistik volume pada Alat Kata Kunci tidak mengambil tumpang tindih ke rekening. Perkiraan lalu lintas seperti klik dan biaya jangan mengambil tumpang tindih ini ke rekening , jadi memeriksa mereka dapat membantu Anda memutuskan jenis pencocokan untuk digunakan .<br />
<br />
<blockquote class="tr_bq">
Sebagai contoh, katakanlah kata kunci Anda adalah dark chocolate . Jika Anda ingin memeriksa pencarian rata-rata bulanan kata kunci itu , kami akan menunjukkan statistik yang sama apakah Anda menggunakan luas, frasa , atau jenis sama persis dengan dark chocolate . Perkiraan lalu lintas seperti klik dan biaya , di sisi lain , lakukan mempertimbangkan jenis pencocokan kata kunci akun . Misalnya, jika Anda mendapatkan perkiraan untuk daftar kata kunci pencocokan luas , kami akan memperhitungkan tumpang tindih antara kata kunci tersebut .</blockquote>
<br />
<b>Tidak ada perangkat penargetan</b><br />
<br />
Perencana Keyword tidak membiarkan Anda secara khusus menargetkan perangkat mobile , seperti tablet dan ponsel . Secara default , pihaknya menargetkan semua perangkat , yang sejalan dengan perubahan terbaru dibuat untuk kampanye AdWords . Kami sedang bekerja pada sebuah fitur yang akan memungkinkan Anda untuk mendapatkan perkiraan lalu lintas menurut jenis perangkat dan menetapkan penyesuaian tawaran untuk perangkat mobile .<br />
<br />
<blockquote class="tr_bq">
Secara umum, Anda akan melihat bahwa data rata-rata volume pencarian lebih tinggi pada Planner Kata Kunci dibandingkan dengan tepat sesuai pencarian volume data Anda punya dengan Keyword Tool . Itu karena kami akan menunjukkan jumlah rata-rata mencari ide kata kunci pada semua perangkat ( komputer desktop dan laptop , tablet , dan ponsel ) . Dengan Keyword Tool , kami menunjukkan Anda rata-rata volume pencarian untuk komputer desktop dan laptop secara default .<br />Perubahan lain dalam kolom data</blockquote>
<br />
<h3>
<b>Apa yang baru di keyword Planner google?</b></h3>
Di masa lalu, Anda mungkin telah mengandalkan alat seperti Keyword Tool dan Lalu Lintas untuk mengidentifikasi kata kunci dan grup iklan baru, mendapatkan perkiraan lalu lintas, dan memilih tawaran yang kompetitif dan anggaran. Kini Seiring waktu, berhubung kami telah mendengar dari Anda bahwa memiliki dua alat untuk membangun kampanye pencarian itu rumit.<br /><br />Kami terus berupaya untuk menyederhanakan proses kampanye, dan hari ini kami senang untuk mengumumkan peluncuran alat, <u>Keyword Planner baru</u>, yang menggabungkan fungsionalitas dari Keyword Tool dan Lalu Lintas menjadi halus dan alur kerja terintegrasi. Anda dapat menggunakan Planner Kata Kunci untuk menemukan kata kunci baru dan ide-ide grup iklan, mendapat taksiran kinerja mereka untuk menemukan tawaran dan anggaran yang tepat untuk Anda, dan kemudian menambahkannya ke kampanye Anda. Anda juga akan melihat beberapa fitur baru dalam alat - beberapa di antaranya kita akan menyoroti bawah ini<br />
<b><br /></b>
<b>Berikut adalah <span style="color: #cc0000;">perbedaannya keyword tools setelah dialihkan ke keyword planner</span></b>:<br />
<br /><span style="color: blue;">Pencarian bulanan lokal dan pencarian global bulanan</span> : Kedua kolom telah digantikan oleh " bulanan rata-rata pencarian " kolom , menyederhanakan data volume pencarian bisa Anda dapatkan. Rata-rata volume pencarian bulanan khusus untuk setelan penargetan Anda , dan Anda bisa mendapatkan data untuk seluruh negara atau kota individu dan wilayah dalam suatu negara . Perhatikan bahwa Anda masih bisa mendapatkan data pencarian bulanan global dengan menargetkan semua lokasi .<div>
<br /><span style="color: blue;">Berbagi Iklan</span>: Kolom ini digantikan dengan kolom baru yang disebut pangsa tayangan iklan untuk membantu Anda mencari potensi tayangan .</div>
<div>
<br /><span style="color: blue;">Jaringan Penelusuran Google </span>: Kolom ini telah digantikan oleh opsi jaringan dalam setelan penargetan . Untuk mendapatkan data untuk seluruh Jaringan Penelusuran , pilih " Google dan mitra penelusuran " pilihan penargetan .</div>
<div>
<br /><span style="color: blue;">Search share</span> : Kolom ini telah dinonaktifkan.</div>
<div>
<br />Appprox. CPC (Search ) : Kolom ini telah digantikan oleh kolom " BPK . " . Anda akan mendapatkan data yang lebih akurat dalam rata-rata kolom biaya per klik daripada yang Anda lakukan di kolom biaya - per-klik perkiraan .</div>
<div>
<br /><span style="color: blue;">Tren pencarian lokal</span> : Kolom ini tidak muncul dalam antarmuka Planner Keyword . Namun, Anda masih bisa mendapatkan tren volume pencarian dengan melayang di atas ikon dalam " bintang . Pencarian bulanan " kolom . Anda juga dapat melihat tren ini tersegmentasi berdasarkan bulan ketika Anda men-download statistik sejarah Anda dari Perencana Keyword .</div>
<div>
<br /><span style="color: blue;">Ekstrak dari halaman web </span>: Kolom ini telah dihapus dari antarmuka Planner Keyword . Namun, Anda masih bisa mendapatkan halaman web gagasan kata kunci datang dari ketika Anda men-download statistik sejarah Anda dari Perencana Keyword . Perhatikan bahwa Anda hanya akan mendapatkan data ini ketika Anda mencari kata kunci dan iklan ide kelompok didasarkan pada URL , seperti halaman web pada website Anda.</div>
<div>
<br /></div>
Unknownnoreply@blogger.com39tag:blogger.com,1999:blog-997877103022851878.post-30431937234914711652013-08-15T21:56:00.000+07:002013-08-15T21:57:29.527+07:00Memasang widget atau banner wordpress (alternatif Pemula)Daripada bengong nih, saya coba posting sesuatu kembali diblog ini, siapa tahu aja bermanfaat. Ini adalah tentang <b>cara membuat atau memasang widget diwordpress</b>. Kebetulan kemarin ada klien "<a href="http://jasawebsiteprofesional.com/" target="_blank">jasa Pembuatan Website</a>" yang betul-betul gaptek soal website,jadi saya buatkan dia contohnya.<br />
<br />
Masalahnya terlebih karna klien yang kami buatkan website tersebut betul-betul pemula, bahkan untuk <i><u>memasang widget wordpress</u></i> saja dia masih perlu dituntun lagi :). Wajar saja namanya juga pemula.<br />
<br />
Maka untuk membantu klien kita ini dan memudahkannya agar bisa<b> membuat widget banner disamping (widget) blog</b>nya , maka alternatif berikut adalah solusinya.<br />
<br />
<a href="http://blog.fispol.com/2013/08/memasang-widget-atau-banner-wordpress.html" target="_blank">Memasang widget atau banner wordpress</a> berikut adalah basi bagi yang sudah tahu, kami harap anda memaklumi kami yang sedang belajar ini. Yang sudah pintar dilarang masuk !...<br />
<br />
Oke langsung saja, tanpa basa basi berikut cara membuat banner widget dalam bentuk teks ataupun gambar di wordpress (full screenshoot). Cekidot................<br />
<br />
<h3 style="-webkit-box-shadow: rgb(255, 255, 255) 0px 1px 0px inset, rgb(255, 255, 255) 0px 1px 0px; background-color: #ebebeb; border-bottom-color: rgb(186, 186, 186); border-bottom-style: solid; border-top-color: rgb(186, 186, 186); border-top-style: solid; border-width: 1px 0px; box-shadow: rgb(255, 255, 255) 0px 1px 0px inset, rgb(255, 255, 255) 0px 1px 0px; color: #333333; font-family: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 24px; margin: 0.25em 0px; outline: 0px; padding: 0.25em 0px; text-align: center; vertical-align: baseline;">
<span style="border: 0px; color: black; font-style: inherit; line-height: normal; margin: 0px; outline: 0px; padding: 0px; text-align: start; vertical-align: baseline;"><span style="font-size: large;">Mengenal Widget Wordpress</span></span></h3>
<div style="text-align: center;">
Pertama, yaitu menemukan halaman widget, dari dasboard WP sorot kemenu "tampilan yang terletak disebelah kiri seperti gambar dibawah ini, lalu Pilih (klik) Widget.</div>
<div style="text-align: center;">
<br /></div>
<table cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><img border="0" height="560" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgwq9UoXAPEQ671MmGIU8LuMEMR1g0QCxMix-klLr02E99o5wPQEk7O8g2PlV8XYfdw2U4RGQD5C-YFszLVn91jNI_0KD3G_u3rclB0wAn7f5E-xe0cYpNDaC574rsZs4nbkHCIWZS_uzfJ/s640/cats.jpg" style="margin-left: auto; margin-right: auto;" width="640" /></td></tr>
<tr><td class="tr-caption" style="text-align: center;">HALAMAN WIDGET dapat ditemukan di Menu <b>TAMPILAN</b> > <b>WIDGET</b></td></tr>
</tbody></table>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div style="text-align: center;">
<img border="0" height="328" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjfGYh2cxECIfcYmHOKJxjIPtpOLEQNh0HxpWWKesME9pok9GM1yNgJwl3pwPNlMFEJ6xzDYAj67JcmxNiZFdeAuM906xtx35p8XH9EJqqrsYywdymqt0eRZOLJ4Wvnnz5TItO9aWm5GYNr/s640/widget+kanan+dan+bawah.jpg" width="640" /></div>
<div class="separator" style="clear: both; text-align: center;">
Maka akan tampillah halaman dapur dari widget. Disana anda akan menemukan 2 komponen. Yang sebelah kiri kita sebut sebagai sumber dan yang sebelah kanan adalah widgetnya. Pada komponen sebelah kiri anda akan menemukan banyak sumber yang dapat dimanfaatkan untuk menciptakan widget. Seperti digambar dibawah ini, menunjukkan bahwa untuk mengaktifkan widget (Tampil di website), kita perlu menarik komponen dari sebelah kiri kekanan.</div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<table cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhcYyqXNnAAkt2n8d5yXHyvxop3FVTZhTvIsENY0yzJJ3xx5Pv4YlQy3eGbE-9Q670X19kT_QBBy0zJVRpmF9uZt8RivF_5vkRWnASEEF620jZyhX9O7kWG2Ay0UZAo92c8FGqXA0dmqWBX/s1600/Widget+Aktif+dan+non+Aktif.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="287" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhcYyqXNnAAkt2n8d5yXHyvxop3FVTZhTvIsENY0yzJJ3xx5Pv4YlQy3eGbE-9Q670X19kT_QBBy0zJVRpmF9uZt8RivF_5vkRWnASEEF620jZyhX9O7kWG2Ay0UZAo92c8FGqXA0dmqWBX/s640/Widget+Aktif+dan+non+Aktif.jpg" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">2 Komponen Widget Wordpress, Kiri sebagai sumber dan kanan adalah widget itu sendiri.</td></tr>
</tbody></table>
<div style="text-align: center;">
<br /></div>
<div class="" style="clear: both; text-align: center;">
Mungkin saya tidak akan dapat menjelaskan semua satu persatu, jadi silahkan dieksperimenkan sendiri. Misalnaya anda ingin menambhkan list kategori, maka cara mudahnya adalah menarik kotak "kategori" yang terletak disebelah kiri ke sebelah kanan atau kekanan bawah (footer)jika anda ingin meletakkannya dibawah kaki halaman web anda. Ingat, ini tergantung apakah thema yang anda gunakan mendukung widget dimaksud atau tidak.</div>
<div class="" style="clear: both; text-align: center;">
<br /></div>
<h3 style="-webkit-box-shadow: rgb(255, 255, 255) 0px 1px 0px inset, rgb(255, 255, 255) 0px 1px 0px; background-color: #ebebeb; border-bottom-color: rgb(186, 186, 186); border-bottom-style: solid; border-top-color: rgb(186, 186, 186); border-top-style: solid; border-width: 1px 0px; box-shadow: rgb(255, 255, 255) 0px 1px 0px inset, rgb(255, 255, 255) 0px 1px 0px; color: #333333; font-family: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 24px; margin: 0.25em 0px; outline: 0px; padding: 0.25em 0px; text-align: center; vertical-align: baseline;">
<span style="color: black; line-height: normal;"><span style="font-size: large;">Menambahkan WIDGET GAMBAR BANNER</span></span></h3>
<div style="text-align: center;">
Untuk menampilakn sesuatu diwidget baik itu teks maupun dalam bentuk foto-foto atau bannerkita dapat mengfungsikan komponen "Teks" yang berada dikomponen sebelah kiri halaman widget. Peratikan gambar dibawah ini. </div>
<div style="text-align: center;">
<br /></div>
<table cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiqQW3srjemHsDK94de8pNgUSgO4HcGdYPL6r2VqfUBIzkt0DKIkSYMOC6hXq_txrWTSw1tXcd1cv1G-nbNMAURz3c2fa-WuNLnA674aIBd7Zob-e4AoIF3eysgHUpGyZ8rZ_CfyVAIA7dz/s1600/Tutorial+widget+Klien+biolo.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="314" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiqQW3srjemHsDK94de8pNgUSgO4HcGdYPL6r2VqfUBIzkt0DKIkSYMOC6hXq_txrWTSw1tXcd1cv1G-nbNMAURz3c2fa-WuNLnA674aIBd7Zob-e4AoIF3eysgHUpGyZ8rZ_CfyVAIA7dz/s640/Tutorial+widget+Klien+biolo.jpg" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">KOtak "teks" ditarik kekanan.</td></tr>
</tbody></table>
<div class="separator" style="clear: both; text-align: center;">
Contoh setelah menarik kotak teks tersebut, kita isi dengan sembarang saja dulu.</div>
<div class="separator" style="clear: both; text-align: center;">
Judul = Widget kanan</div>
<div class="separator" style="clear: both; text-align: center;">
Isi = Isi Widget</div>
<div class="separator" style="clear: both; text-align: center;">
Maka tampilannya kira-kira, tereret-teret...seperti berikut:</div>
<div style="text-align: center;">
<img border="0" height="616" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvHMHtVdUSyogmyqQCN9Ml2C5LayXEkDdBhCcFdu11WdWr8MRwLnr5EttFtl-fA77JO0EKaLz1_ZI4EN0wCB5cpR-IJ3KUWc2tztScntxrgvxuIK1Amw-3icwbwTZEnevyCkCBxj_4IQdc/s640/Hasil+pembuatan+Widget.jpg" width="640" /></div>
<h3 style="-webkit-box-shadow: rgb(255, 255, 255) 0px 1px 0px inset, rgb(255, 255, 255) 0px 1px 0px; background-color: #ebebeb; border-bottom-color: rgb(186, 186, 186); border-bottom-style: solid; border-top-color: rgb(186, 186, 186); border-top-style: solid; border-width: 1px 0px; box-shadow: rgb(255, 255, 255) 0px 1px 0px inset, rgb(255, 255, 255) 0px 1px 0px; font-family: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; margin: 0.25em 0px; outline: 0px; padding: 0.25em 0px; text-align: center; vertical-align: baseline;">
<span style="font-size: large;">Bagi yang kesulitan membuat widget, ini caranya.</span></h3>
<div>
<div style="text-align: center;">
<br /></div>
</div>
<div class="" style="clear: both; text-align: center;">
Buat tulisan baru (<b>Tulisan > Tambah Baru</b>). Buat judul sembarang saja, dan biarkan isinya kosong. lalu upload foto yang akan dijadikan banner foto widget kedalam tulisan tersebut</div>
<div style="text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjr88wo1BGozEhJs5yU-hW4LQ2D1rGIp51aaDYQnI6vECTCMamK25qYjolGDnTK1luhMeqIexOKonqTm1Vmkgx74PREJUI2AZhnyLD-QlkyYLK9XHxnehxm7McPuL2S0miHLL33ad6wileo/s1600/foto.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="314" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjr88wo1BGozEhJs5yU-hW4LQ2D1rGIp51aaDYQnI6vECTCMamK25qYjolGDnTK1luhMeqIexOKonqTm1Vmkgx74PREJUI2AZhnyLD-QlkyYLK9XHxnehxm7McPuL2S0miHLL33ad6wileo/s640/foto.jpg" width="640" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
Seperti gambar diatas, setelah gambar selesai diupload kedalam tulisan. Coba cari dan klik "text" yang terletak dikanan atas editor tulisan(lihat gambar 1).</div>
<div class="separator" style="clear: both; text-align: center;">
Jika benar, maka anda akan menemukan kode sourcenya sepertigambar dibawah ini. Selanjutnya Copy semua file dalam kotak editor tulisan tersebut dan simpan tulisan ini sebagai konsep saja (perhatikan gmar dibawah ini.</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZf_MRmsXGZpDC8t1e0p_5_DR9s8X4WkMmQT4LQYs3BNpX5TMehO7b0DS3fVygnBjw1eJo5xSMruZtjOKUjhqW4BuvvyD62VEYTM0HIFy7NBd8P-KR7fWY6VAiCCmZegZL9sqvg5YHSbCm/s1600/foto+2.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="313" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZf_MRmsXGZpDC8t1e0p_5_DR9s8X4WkMmQT4LQYs3BNpX5TMehO7b0DS3fVygnBjw1eJo5xSMruZtjOKUjhqW4BuvvyD62VEYTM0HIFy7NBd8P-KR7fWY6VAiCCmZegZL9sqvg5YHSbCm/s640/foto+2.jpg" width="640" /></a></div>
<div style="text-align: center;">
<br /></div>
<div style="text-align: center;">
Langkah berikutnya adalah menempelkan kode yang kita salin tersebut ke halaman widget. Perhatikan gambar dibawah ini</div>
<div style="text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh7CtaFvbZEpB-TwJmE_EqfiSyGMzIBGt7q0VcM7TcnbiNio6KGy0pHpnC16p9lXSbersFk-jSy-d6AQjHa9-3qH0HYwDQrxqdMph22XPLtgvyGzQKVnS4RJbZYlfLVaYE1tUY4-BRgcb76/s1600/Paste+foto.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="640" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh7CtaFvbZEpB-TwJmE_EqfiSyGMzIBGt7q0VcM7TcnbiNio6KGy0pHpnC16p9lXSbersFk-jSy-d6AQjHa9-3qH0HYwDQrxqdMph22XPLtgvyGzQKVnS4RJbZYlfLVaYE1tUY4-BRgcb76/s640/Paste+foto.jpg" width="571" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
Tuliskan Judul bisa juga dikosongkan. dibawahnya adalah tempat anda menempelkan kode source yang tadi dicopy (perhatikan gambar diatas). Pada contoh diatas, maka berikut hasilnya.</div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjgFvjaGPOGvzBdVD3scplzkwS_fm65GDOYbemWzjuDJF3CyL3EuZaN2nRhwWvlymKlSR_FqLNs9UbVphUoFeG7fWkZlROZoCB0SJteOcuvELYoNcyIVuFreTRMmlOMliciBhIlFnrad7hR/s1600/Hasil+foto.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="395" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjgFvjaGPOGvzBdVD3scplzkwS_fm65GDOYbemWzjuDJF3CyL3EuZaN2nRhwWvlymKlSR_FqLNs9UbVphUoFeG7fWkZlROZoCB0SJteOcuvELYoNcyIVuFreTRMmlOMliciBhIlFnrad7hR/s400/Hasil+foto.jpg" width="400" /></a></div>
<div style="text-align: center;">
<br /></div>
<div style="text-align: center;">
<br /></div>
<div style="text-align: center;">
<br /></div>
<div style="text-align: center;">
---- Tamat ----</div>
<div style="text-align: center;">
<br /></div>
<div style="text-align: center;">
<br /></div>
<div style="text-align: center;">
<br /></div>
Unknownnoreply@blogger.com41tag:blogger.com,1999:blog-997877103022851878.post-64158015926810560932013-06-25T23:25:00.000+07:002013-06-25T23:33:04.144+07:00Topik Baru ! Tentang Template Blog Yang ResponsiveTemplate blog, Blog & Tips Seo - Berdasarkan penelitian yang saya lakukan, <a href="http://blog.fispol.com/p/template-blog.html" target="_blank">Template blog</a> yang paling dicari para blogger baru-baru ini adalah yang support <b>responsive</b> (baca:responsif). Oleh sebab itu saya akan mencoba menguolasnya disini dan membuat label baru membahas tentang <u>template yang responsive</u> secara khusus.<br />
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><img alt="Tentang Template Blog Yang Responsive" border="0" height="193" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUP7YFhItEQI3VHtGa4NdsCMYh1SS-8dT0utiRuwtNRUSqZEhe8kCS1BxwRczOQHeV6K_aF9skFw0z55QmxjYjOZDgWJYP9OjnglsLGoUcA8ciU6Z_K2yjgbEn7JKzHZtBTrkMLNmTO8nn/s320/responsive_web_design.png" style="margin-left: auto; margin-right: auto;" title="Tentang Template Blog Yang Responsive" width="320" /></td></tr>
<tr><td class="tr-caption">Template Responsive adalah blog yang dapat menyesuaikan lebar, tinggi, besar/kecil tulisan secara otomatis sesuai tempat-nya</td></tr>
</tbody></table>
<br />
<br />
<ul>
<li>Template blogger Responsive</li>
<li>Thema Wordpress responsive</li>
</ul>
<br />
Dalam artikel sebelumnya <a href="http://blog.fispol.com/2013/06/cara-Membuat-template-responsive-blogger.html">Tampilan Mobile, Tutorial Modifikasi Template blog Menjadi Rensponsive</a>, kita telah memulainya dan berkesimpulan bahwa: Template Responsive adalah blog yang dapat menyesuaikan lebar, tinggi, besar/kecil tulisan secara otomatis sesuai tempat-nya, Seperti gadget yang kita gunakan misalnya Laptop, Tablet, Smart Phone. Tentu setiap gadget ukuran resolusi layarnya berbeda-beda ada yang 1680x1050, 1024x768, 768x1024, 320x420 dll.<br />
Adapun topik ini akan mengumpukan serta memberikan rekomendasi template-template yang responsive support, dan tentunya menambahkan beberapa optimasi yang diperlukan.<br />
<br />
Demikian informasi tidak penting ini. Nantikan kami diDirektori Label <a href="http://blog.fispol.com/p/template-blog.html" target="_blank">template</a> ===> <a href="http://blog.fispol.com/search/label/responsive" target="_blank">Responsive</a>Unknownnoreply@blogger.com14tag:blogger.com,1999:blog-997877103022851878.post-30359912632553433542013-06-23T06:28:00.004+07:002013-06-23T06:32:36.057+07:00Download & Instal CMS Wordpres 3.5.2, apa yang baru?Info Update Wordpress, Blog & Tips SEO - Kabar baik bagi pengguna wordpress, Versi upgrade wordpress terbaru telah resmi dirilis, siap anda download dan instal, baik secara otomatis maupun diisntal manual melalui FTP diwebsite anda.<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><img alt="Download & Instal CMS Wordpres 3.5.2" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjRj0DAuOywd1CWf-Nsi1Y51DkMl6BeKOJ8ZQmR2w7tUFPEsQJeVPvlwXbVV6a9GcEQF0mOFkbBY_7VJ4fGJfkTUSBKqfM4g2Fujisinq6ulv-WdagR0Gh0hq2MlhwfMXb1iKWAgtwQJXlh/s1600/Versi+Baru+wordpress+3.5.2.jpg" style="margin-left: auto; margin-right: auto;" title="Download & Instal CMS Wordpres 3.5.2" /></td></tr>
<tr><td class="tr-caption" style="text-align: center;">CMS Wordpres 3.5.2 Versi Baru</td></tr>
</tbody></table>
<div>
<br />
<div>
<br /></div>
<div>
Mungkin info update wordpress ini sudah banyak yang tahu, apalagi didashboard juga ada notifikasi tentang berita tersebut. nah, bagi yang belum tahu, maka inilah infonya, sekalian melihat apa saja sih fitur-fitur ada wordpress 3.5.2 baru ini.</div>
<div>
<br /></div>
<div>
<h3 style="-webkit-box-shadow: rgb(255, 255, 255) 0px 1px 0px inset, rgb(255, 255, 255) 0px 1px 0px; background-color: #ebebeb; border-bottom-color: rgb(186, 186, 186); border-bottom-style: solid; border-top-color: rgb(186, 186, 186); border-top-style: solid; border-width: 1px 0px; box-shadow: rgb(255, 255, 255) 0px 1px 0px inset, rgb(255, 255, 255) 0px 1px 0px; color: #333333; font-family: inherit; font-size: inherit; font-style: inherit; font-variant: inherit; line-height: 23.99305534362793px; margin: 0.25em 0px; outline: 0px; padding: 0.25em 0px; text-align: center; vertical-align: baseline;">
<span style="color: black; line-height: normal; text-align: start;">Fitur Baru di Wordpres 3.5.2</span></h3>
</div>
<div>
<br /></div>
<div>
Ada beberepa perbaikan yang ditamabahkan pada versi baru wordpress kali ini untuk memperbaharui beberapa bugs yang terjadi pada versi-versi wordpress sebelumnya (3.5.1). Seperti dijelaskan dalam rilisnya disebutkan bahwa pihak wordpress telah mengupdate beberapa celah keamanan cms tersebut, yaitu 12 bug yang sebelumnya terdapat pada versi 3.5.1. Beberapa diantaranya soal XSRF (Cross-site Request Forgery), Bug pada kemampuan penerbitan pada kontributor dan penumpukan nama penulis pada saat mengedit post, bug XSRF di SWFUpload, TinyMCE, dan banyak tempat (khususnya yang mempunyai kapasitas editor teks), dan proteksi DDOS.</div>
<div>
<br /></div>
<div>
Sangat dianjurkan khususnya yang mengunakan wordpress untuk mendownload versi baru ini dan segera menginstalnya pada web anda.</div>
<div>
<br /></div>
<div>
7 Hal penting versi baru wordpress ini antara lain:</div>
<div>
<br /></div>
<ol>
<li>Memblokir serangan pemalsuan permintaan server-side, yang berpotensi memungkinkan penyerang untuk mendapatkan akses ke situs.</li>
<li>Kontributor dilarang menerbitkan posting, dimana gal itu pernah dilaporkan oleh Konstantin Kovshenin, atau pemindahan kepenulisan posting, yang pernah dilaporkan oleh Lukas Bryan.</li>
<li>Sebuah update untuk perpustakaan eksternal SWF Upload untuk memperbaiki kerentanan cross-site scripting. Dilansir oleh mala dan Szymon Gruszecki.</li>
<li>Pencegahan serangan penolakan layanan, yang mempengaruhi situs menggunakan tulisan yang dilindungi password.</li>
<li>Pembaharuan pada perpustakaan TinyMCE eksternal untuk memperbaiki scripting kerentanan cross-site. Hal ini pernah Dilaporkan oleh Wan Ikram. </li>
<li>Beberapa perbaikan untuk cross-site scripting. Dilansir Andrea Santese dan Rodrigo.</li>
<li>Solusi permasalahan path file saat meng-upload gagal. Problem yang dilaporkan oleh Jakub Galczyk.</li>
</ol>
<div>
<div>
<br /></div>
<div>
<h3 style="-webkit-box-shadow: rgb(255, 255, 255) 0px 1px 0px inset, rgb(255, 255, 255) 0px 1px 0px; background-color: #ebebeb; border-bottom-color: rgb(186, 186, 186); border-bottom-style: solid; border-top-color: rgb(186, 186, 186); border-top-style: solid; border-width: 1px 0px; box-shadow: rgb(255, 255, 255) 0px 1px 0px inset, rgb(255, 255, 255) 0px 1px 0px; color: #333333; font-family: inherit; font-size: inherit; font-style: inherit; font-variant: inherit; line-height: 23.99305534362793px; margin: 0.25em 0px; outline: 0px; padding: 0.25em 0px; text-align: center; vertical-align: baseline;">
<span style="color: black; line-height: normal; text-align: start;">Download Wordpres 3.5.2</span></h3>
</div>
<div>
<br /></div>
<div>
Bagi yang yang belum mendowload, silahkan kunjungi situs resmi http://wordpress.org. Atau untuk akses cepat download wordpress 3.5.2 ini bisa <a href="http://wordpress.org/latest.zip" rel="nofollow" target="_blank">Klik Disini</a>. Oh ya, jika wordpress belum di modifikasi, petunjuk tentang download dan cara instalnya pasti akan anda temukan didashboard WP anda, So buruan menuju wp-login :D.</div>
<div>
<br /></div>
</div>
</div>
Unknownnoreply@blogger.com6tag:blogger.com,1999:blog-997877103022851878.post-13782195156048752212013-06-22T06:43:00.000+07:002017-06-20T09:06:18.107+07:00Tampilan Mobile, Tutorial Modifikasi Template blog Menjadi Rensponsive <b>Blog & Tips Seo</b>, <i>Modifikasi Template Blogger menjadi responsive</i> - Akhirnya blog ini telah diperbaharui dan sekarang <u>menjadi responsive</u>, sehingga jika diakses melalui perangkat manapun baik itu mobile seluler, tampilannya akan disesuaiakan sesuai dengan layar pembacanya. Saya juga edit-edit sedikit beberapa komponen lainnya agar tampilannya lebih menarik dan simple, salah satunya adalah <span style="color: blue;">logo blog</span> kita yang baru. Sudahkah anda lihat diatas? di footer blog ini merupakan tampilan logo mininya... :D dan mudah-mudahan anda tidak mengejek saya karna logo tersebut kurang mantap editannya.<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjznbuKv3mAgA-QHGs1270oZQvsGiY6Dh7dYiMRnR1JpY8ME1_AGlHWDM_2AdnBXcRseV2DOv5ZYVFzSqQPdynIvl6YAhLbXq8XkmVQwRV4eUIscvMq9-OHWGIRes2iY-A3p0NgoOzl7LKk/s1600/blogseo+240x98.png" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="Tampilan Logo baru Blog Responsive" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjznbuKv3mAgA-QHGs1270oZQvsGiY6Dh7dYiMRnR1JpY8ME1_AGlHWDM_2AdnBXcRseV2DOv5ZYVFzSqQPdynIvl6YAhLbXq8XkmVQwRV4eUIscvMq9-OHWGIRes2iY-A3p0NgoOzl7LKk/s1600/blogseo+240x98.png" title="Tampilan Logo baru Blog Responsive" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Tampilan Logo Baru !!! </td></tr>
</tbody></table>
Oh ya, soal tampilan logo baru diatas, tolong jangan tanya macam-macam. Kenapa ada penembaklah ? kenapa Hurufnya miringlah? karna ini hanyalah tampilan logo sebagai pelengkap blog yang menjadi responsive :D #Mari ketawa :D 3333x hahahahah.....<br />
<h4>
Kenapa Oh kenapa, dan haruskah tampilan blog responsive?</h4>
Saya menyempatkan diri untuk <b>memperbaharui/modifikasi tampilan blog</b> karna banyak keluhan yang mengatakan "blog tidak menampilkan resolusi yang tepat bagi pembaca, tidak sesuai dengan ukuran lebar layar pada monitor mereka". Dan itu benar, pembaca harus dilayani karna mereka adalah raja bagi sebuah blog.<br />
<br />
Dulu saya sempat mengabaikannya, saya pikir tampilan blog / template tanpa responsive tidak memiliki dampak besar bagi blog. Tapi ternyata saya harus mulai memikirkan tentang penyesuaian layar bagi pembaca setelah diketahui bahasanya pengunjung (pengguna internet) sekarang ini rata-rata 70% menggunakan perangkat mobile seperti Ipad, Hp, blackberry dalam berselancar didunia internet.<br />
<br />
Yups, untuk mengetahuinya anda bisa melakukan riset sediri. Masuk ke dashboard ==> statistik blog anda. Lihat dari mana datangnya para pengunjung tersebut. Banyak bukan dari perangkat seluler non PC?<br />
<br />
So, sudah menjadi dasar penting bagi kemajuan blog untuk mendesain tampilan layar menjadi lebih ramah perangkat seluler yang memiliki lebar berbeda-beda (Mobile friendly blog).<br />
<br />
Dalam beberapa waktu akhirnya template blog ini telah disulap menjadi Responsive, Mobile friendly dan bisa diakses perankat apa saja termasuk seluler dalam berbagai ukuran layar.<br />
<br />
Apakah template blog ini sudah responsive? Terus terang saya sendiri masih belum dapat memastikan apakah benar template ini sudah menjadi responsive atau tidak? dapatkah anda membaca artikel blog ini melalui handphone seluler, tab, ipad, iphone? bagaimana dengan resolusinya. Yuk mari bantu saya, coba cek melaui perangkat anda.<br />
<br />
<div>
<h3 style="-webkit-box-shadow: rgb(255, 255, 255) 0px 1px 0px inset, rgb(255, 255, 255) 0px 1px 0px; background-color: #ebebeb; border-bottom-color: rgb(186, 186, 186); border-bottom-style: solid; border-top-color: rgb(186, 186, 186); border-top-style: solid; border-width: 1px 0px; box-shadow: rgb(255, 255, 255) 0px 1px 0px inset, rgb(255, 255, 255) 0px 1px 0px; color: #333333; font-family: inherit; font-size: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 23.99305534362793px; margin: 0.25em 0px; outline: 0px; padding: 0.25em 0px; text-align: center; vertical-align: baseline;">
Cara Saya Mengetahui Tampilan Blog Responsive</h3>
</div>
<div>
<br /></div>
<div>
Cara yang saat ini saya lakukan untuk mengetahui <i>apakah template blog yang kita gunakan sudah responsive</i> dengan tampilan mobile adalah dengan menyesuaikan (<span style="color: red;">minimaze</span> + maximaze) ukuran browser yang digunakan.</div>
<div>
<br /></div>
<div>
contohnya saat ini saat sedang memanfaatkan browser google chrome, maka untuk memastikan blog sudah responsive dan support mobile caranya adalah :</div>
<div>
<br /></div>
<div>
Pertama, kunjungi objek dalam contoh ini adalah halam beranda di blog ini sendiri http://blog.fispol.com/.</div>
<div>
<br /></div>
<div>
Langsung saja arahkan perhatian anda kesudut atas paling kanan Chrome dan klik pada kotak Minimaze (Biasa terletak ditengah antara 3 tombol berdampingan). Seperti tampilan dibawah ini.<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj3pUHi-xGLNI3-LyLWOVi_OxjpzaoBCU_OMid6D5COPMyxz46-IhYhE27ZIfL6mly2BrW9zsPXf229IQBnsrgLhWEo36k_CJy3oP5RWk-OAl8JnOzf6zY9siLkbLPg-4IASYChDA-J3jiA/s1600/Tampilan+Blog+Responsive+Lebar+800.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="Membuat Tampilan Blog responsive" border="0" height="318" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj3pUHi-xGLNI3-LyLWOVi_OxjpzaoBCU_OMid6D5COPMyxz46-IhYhE27ZIfL6mly2BrW9zsPXf229IQBnsrgLhWEo36k_CJy3oP5RWk-OAl8JnOzf6zY9siLkbLPg-4IASYChDA-J3jiA/s400/Tampilan+Blog+Responsive+Lebar+800.jpg" title="Membuat Tampilan Blog responsive" width="400" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Tampilan blog Home pada layar dengan lebar 800px keatas</td></tr>
</tbody></table>
Selanjutnya untuk menyesuaikan lebar layar adalah dangan menarik sudut tepi kanan / kiri kedalam, ini akan mengecilkan ukuran layar dan kita bisa melihat apakah blog tersebut responsive / mobile friendly?<br />
<br />
Ketika Dikecilkan (layar browser) maka blog akan menyesuiakan ukuran lebarnya sehingga konten dapat terbaca secara keseluruhan.<br />
<div class="separator" style="clear: both; text-align: center;">
</div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_LYfWRV52Q5dwkT0g5Dr03RVBhV5EQqhN-3iMBQiB1WfGMuYEGPz2DKUm7VcuYIfNtG4w0rhZFmV0RO1btDv3cqGL1N-_1hSgAl95Zr4AUENmaKMuMOmYFHMY9FROUkQpohgdMxnTvYZH/s1600/Tampilan+responsive+Blog+ukuran+600.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="menjadikan Rensponsive / Mobile friendly" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_LYfWRV52Q5dwkT0g5Dr03RVBhV5EQqhN-3iMBQiB1WfGMuYEGPz2DKUm7VcuYIfNtG4w0rhZFmV0RO1btDv3cqGL1N-_1hSgAl95Zr4AUENmaKMuMOmYFHMY9FROUkQpohgdMxnTvYZH/s1600/Tampilan+responsive+Blog+ukuran+600.jpg" title="menjadikan Rensponsive / Mobile friendly" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Tampilan Blog pada layar 650px kebawah</td></tr>
</tbody></table>
<div class="separator" style="clear: both; text-align: center;">
Pada layar dengan ukuran lebar 650px atau lebih kecil, tampilan blog berubah otomatis disesuikan dengan lebar monitor pembaca. Lihat pada menu navigasi dibawah judul blog menjadi 2 kolom dengan lebar 90% dari ukuran layar pembaca. Ketika anda mengecilkan layarnya maka ukurannya pun mengikutinya. Contohnya, pada ukuran ini Sidebar yang tadinya terletak disebelah kanan yang mengandung widget-widet blog seperti populer post dan lain tidak berada pada posisinya, sekarang anda akan menemukan sidebar diletakkan dibawah konten utama dan lebarnya pun lebih besar (sesuai dengan ukuran layar).... dan seterusnya.</div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1Hq0CyyQ0jHWC5GX2BieqMopxfnCi_iXlbYQetimRX7AArcSAwiHmsq5JOGqGYfSvBZHaxyLmQy0ffwtwccUZBGlUC7H9yXmruk7whti9FH9LIUm7C7phXrFVdWrdXPY7TykiqL4yK4dB/s1600/Tampilan+Blog+responsive+ukuran+300.jpg" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img alt="modifikasi tampilan blog Responsive" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1Hq0CyyQ0jHWC5GX2BieqMopxfnCi_iXlbYQetimRX7AArcSAwiHmsq5JOGqGYfSvBZHaxyLmQy0ffwtwccUZBGlUC7H9yXmruk7whti9FH9LIUm7C7phXrFVdWrdXPY7TykiqL4yK4dB/s1600/Tampilan+Blog+responsive+ukuran+300.jpg" title="modifikasi tampilan blog Responsive" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">Tampilan Blog pada layar dengan lebar maximal 320 px</td></tr>
</tbody></table>
<div class="separator" style="clear: both; text-align: center;">
Pada ukuran yang lebih seksi :D, maksud saya " Ramping", padat atau lebih kecil layarnya, layar ukuran 320px (lebar) maka tampilannya juga menyesuaikan pada layar pengguna. Ada beberapa komponen blog yang di sembunyikan, dan beberapa lagi disesuaikan lebarnya agar benar2 tampil responsive. Pada blog ini, saya menyembunyikan related post beserta permalink otomatis karna menurut saya terlalu semraut dan membuat tampilan menjadi berantakan. Saya juga membuat menunya menjadi 1 kolom saja agar sesuai dengan ukuran pada layar di handphone pembaca.</div>
<div class="separator" style="clear: both; text-align: center;">
<br /></div>
<div class="separator" style="clear: both;">
So, Apakah anda menemukan blog ini tampilannya responsive pada perangkat mobile / seluler yang sedang anda gunakan saat ini? *<span style="color: red;">Kotak komentar masih lapang loh untuk menceritakannya :)...</span></div>
<br />
<br />
<div>
<u><b>Jadi, Blog Responsive adalah</b></u><br />
<u><br /></u>
<br />
<blockquote class="tr_bq">
Kesimpulannya adalah Blog Responsive adalah blog yang dapat menyesuaikan lebar, tinggi, besar/kecil tulisan secara otomatis sesuai tempat-nya, Seperti gadget yang kita gunakan misalnya Laptop, Tablet, Smart Phone. Tentu setiap gadget ukuran resolusi layarnya berbeda-beda ada yang 1680x1050, 1024x768, 768x1024, 320x420 dll.</blockquote>
<span id="goog_29382238"></span></div>
<div>
<br /></div>
Jadi sebuah website/blog akan menyesuaikan dengan ukuran resolusi layar gadget itu sendiri misalnya website dengan ukuran lebar 1024px dibuka menggunakan gadget Iphone atau smartphone beresolusi 420x320 jika website tersebut bersifat responsive maka otomatis lebar website tersebut akan berubah menjadi 420px.<br />
<br />
<h3 style="-webkit-box-shadow: rgb(255, 255, 255) 0px 1px 0px inset, rgb(255, 255, 255) 0px 1px 0px; background-color: #ebebeb; border-bottom-color: rgb(186, 186, 186); border-bottom-style: solid; border-top-color: rgb(186, 186, 186); border-top-style: solid; border-width: 1px 0px; box-shadow: rgb(255, 255, 255) 0px 1px 0px inset, rgb(255, 255, 255) 0px 1px 0px; color: #333333; font-family: inherit; font-size: inherit; font-style: inherit; font-variant: inherit; line-height: 23.99305534362793px; margin: 0.25em 0px; outline: 0px; padding: 0.25em 0px; text-align: center; vertical-align: baseline;">
Bagaimana cara saya membuat blog ini menjadi responsive</h3>
<div>
<br /></div>
Pertanyaan yang hanya dilontarkan oleh pemula seperti saya "Bagaimana cara mengedit template agara tampilan blog menjadi responsive dan support mobile?".<br />
<br />
Sebenarnya agar blog tampil dan support di perangkat seluler, blog dengan platform blogger mendukungnya. Pihak blogger memberikan peluang bagi anda untuk menampilkan versi mobile blog tanpa perlu usaha banyak otak-atik / <b>modifikasi template</b>. Anda dapat mengaktifkannya pada halaman template didashboard blogger anda.<br />
<br />
Namun bagi sebagian orang tampilan seluler mungkin kurang baik, karna penyesuaian blog diatur oleh google. Contohnya; gaya blog tidak sesuai kenginan, juga terpangkasnya beberapa widget dan aksesoris blog yang harusnya di tampilkan kepada pembaca.Sehingga perlu memodifikasi template agar sesuai dengan keinginan kita sendiri, menentukan widget pada perangkat dan jangan lupa untuk terlebih dahulu menonaktifkan tampilan seluler dari blogger.<br />
<br />
<b><span style="color: red;">Inilah Usaha yang saya kerjakan untuk <a href="http://blog.fispol.com/2013/06/cara-Membuat-template-responsive-blogger.html" target="_blank">membuat template blog</a> menjadi responsif...</span></b><br />
<br />
Sebelum menjelaskan, ada persyaratan yang harus dipenuhi, saya tidak menganjurkan anda melakukan ini *edit template css / jika anda tidak yakin memahami dasar-dasar dan struktur template dengan paltform blogger. Karna resikonya cukup berat dan bisa merudak tampilan pada blog anda.<br />
<br />
Untuk Anda yang sekedar ingin memasang atau memperbaharui template, lebih baik dan direkomendasikan hanya perlu mencari template yang responsive serta support mobile saja, Salah satu rekomendasi saya untuk anda perimbangkan adalah kolekasi template rensponsive Maskolis atau cek di Mastemplate. Sedangkan bagi anda yang ingin mengetahui secara lengkap tentang bahasan ini, silahkan download template (Blog dan Tips Seo ) lengkap nanti. Saya akan bongkar rahasia tak penting bagi anda, tanpa menyembunyikan satupun unsur yang saya pasang diblog kami ini. *<span style="color: red;">Email anda sisipkan</span><br />
<br /></div>
<div>
<h3 style="-webkit-box-shadow: rgb(255, 255, 255) 0px 1px 0px inset, rgb(255, 255, 255) 0px 1px 0px; background-color: #ebebeb; border-bottom-color: rgb(186, 186, 186); border-bottom-style: solid; border-top-color: rgb(186, 186, 186); border-top-style: solid; border-width: 1px 0px; box-shadow: rgb(255, 255, 255) 0px 1px 0px inset, rgb(255, 255, 255) 0px 1px 0px; color: #333333; font-family: inherit; font-size: inherit; font-style: inherit; font-variant: inherit; line-height: 23.99305534362793px; margin: 0.25em 0px; outline: 0px; padding: 0.25em 0px; text-align: center; vertical-align: baseline;">
Tutorial Dasar Modifikasi / Cara Membuat Rensponsive</h3>
</div>
<div>
<div>
<u><br /></u></div>
Karna Blog Responsive adalah blog yang dapat menyesuaikan lebar, tinggi, besar/kecil tulisan secara otomatis sesuai tempat-nya maka Untuk <a href="http://blog.fispol.com/2013/06/cara-Membuat-template-responsive-blogger.html" target="_blank">membuat blog menjadi responsive </a>cukup menambahkan kode @media-query pada CSS. Apa itu media query? </div>
<div>
<br /></div>
CSS Media query memungkinkan Anda untuk menargetkan aturan CSS berdasarkan - misalnya - ukuran layar, perangkat-orientasi atau display-density. Ini berarti Anda dapat menggunakan CSS Media Query untuk men-tweak CSS untuk iPad, printer atau membuat situs responsif. Lengkapnya tentang CSS Media query selain pada topik ini (template responsif) dapat dibaca <a href="http://www.w3.org/TR/css3-mediaqueries/" rel="nofollow" target="_blank">disana</a>.<br />
<div>
<br />
<div>
Jadi, untuk membuat blog tampil responsif, kita akan membuat CSS Media query terlebih dahulu lalu menyisipkannya kedalam template.</div>
<div>
<br /></div>
<div>
"<span style="color: red;">ini sulit ya</span>?"</div>
<div>
Oh no!, ini sangat mudah man, santai saja anda akan mengerti jika anda belajar dan menyelesaikan bacaan ini.</div>
<div>
<br /></div>
<div>
Beruntungnya anda tidak perlu mempelajari semua tentang media query, tapi cukup memahami media query standar berbagai perangkat. Berikut silahkan dipahami:</div>
<div>
<br /></div>
<div style="text-align: center;">
<h4>
<b>1. Pedoman Media Queries diberbagai perangkat</b></h4>
</div>
<div style="text-align: center;">
<br /></div>
<br />
<span style="color: blue;">/* Smartphones (portrait dan landscape) ----------- */ </span><br />
<br />
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) { /* <b>gaya Css responsive</b> */ } <br />
<br />
<br />
<span style="color: blue;">/* Smartphones (landscape) ----------- */ </span><br />
<br />
@media only screen and (min-width : 321px) { /* <b>gaya Css responsive anda</b> */ } <br />
<br />
<br />
<span style="color: blue;">/* Smartphones (portrait) ----------- */ </span><br />
<br />
@media only screen and (max-width : 320px) { /* <b>gaya Css responsive anda</b> */ } <br />
<br />
<br />
<span style="color: blue;">/* iPads (portrait and landscape) ----------- */</span><br />
<br />
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) { /* <b>gaya Css responsive anda</b> */ } <br />
<br />
<br />
<span style="color: blue;">/* iPads (landscape) ----------- */</span><br />
<br />
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) { /* <b>gaya Css responsive anda</b> */ } <br />
<br />
<br />
<span style="color: blue;">/* iPads (portrait) ----------- */ </span><br />
<br />
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) { /* <b>gaya Css responsive anda</b> */ } <br />
<br />
<br />
<span style="color: blue;">/* Media untuk layar komputer atau laptop ----------- */ </span><br />
<br />
@media only screen and (min-width : 1224px) { /* <b>gaya Css responsive anda disini</b> */ } <br />
<br />
<br />
<span style="color: blue;">/* layar besar ----------- */</span><br />
<br />
@media only screen and (min-width : 1824px) { /* <b>gaya Css responsive anda</b> */ } <br />
<br />
<br />
<span style="color: blue;">/* iPhone 4 ----------- */</span><br />
<br />
@media only screen and (-webkit-min-device-pixel-ratio : 1.5), only screen and (min-device-pixel-ratio : 1.5) { /* <b>gaya Css responsive anda</b> */ }<br />
<br />
<blockquote class="tr_bq">
Catatan: Media quuery diatas boleh digunakan semua atau beberapa saja juga boleh tergantung kebutuhan setia anda. Yang warna <span style="background-color: blue;">biru</span> adalah komentar / penjelasan tentang pada perangkat berukuran apa saja dia akan bekerja (tidak ditulis juga tidak masalah). Sedangkan yang berwarna hitam tebal " <b>gaya Css responsive anda" </b>adalah kode style / css responsive yang akan menentukan tampilannya<b>.</b></blockquote>
</div>
<div>
<div>
<div style="text-align: center;">
<b>2. Komponen - Struktur Template Blog</b></div>
<br />
Seperti saya katakan diatas, anda setidaknya mengetahui dasar-dasar pada HTML blogger karna usaha yang akan kita lakukan adalah berenang kedalam lautan kode-kode HTML pada template blogger...dan tentu saja, ulasan mengenai ini tidak akan bisa diceritakan pada halaman ini, disarankan untuk kembali membuka buku atau rajin bertanya kepada Om <a href="http://google.com/" target="_blank">google</a>, jika tidak? anda akan tenggelam dan terjatuh tak bisa bangkit lagi *cakra khan :D. Misalnya nih, anda menemukan bagian <div id="<span style="color: red;">keongracun</span>">blalalala teks dan blablalalallaa </div> maka itu adalah komponen <span style="color: red;">keongracun.</span><br />
<br />
<div style="text-align: center;">
Kita ambil contoh Pada template ini, strukturnya dibuat dengan komponen dasar:</div>
<br />
<div style="text-align: center;">
<span style="color: blue;">header</span></div>
<div style="text-align: center;">
<span style="color: orange;">botmenu</span></div>
<div style="text-align: center;">
Pengantar</div>
<div style="text-align: center;">
<span style="color: blue;">Content</span></div>
<div style="text-align: center;">
<span style="color: red;">right</span></div>
<div style="text-align: center;">
<span style="color: #3d85c6;">footer</span></div>
<div style="text-align: center;">
<br /></div>
<div style="text-align: center;">
<br /></div>
</div>
<div>
<div style="text-align: center;">
<b>3.Membuat Css Media Query responsive pada Template</b></div>
<br />
Setelah mengetahui komponen dalam struktur template diblogger anda, mari memasaknya agar siap hidang :D, maksud saya membuat @media query nya gitu loh :)...<br />
<br />
Pada contoh ini, Kita akan mengatur tampilan blog pada perangkat berlayar seksi atau kecil dengan lebar 320px atau lebih kecil. Langsung kita pasangkan sesuai dengan contoh komponen dan struktur template diatas, maka css query agar template menjadi responsive bisa jadi sebagai berikut:<br />
<br />
<span style="color: blue;">/* Inilah gaya blog responsive dihape anda berukuran kecil ----------- */</span><br />
<br />
@media only screen and (Max-width : 320px)<br />
{#header,#botmenu,#Pengantar,#Content,#right,#footer{width:100%} }</div>
<div>
<br /></div>
<div>
atau bisa juga</div>
<div>
<br /></div>
<div>
@media only screen and (Max-width : 320px)<br />
{#header,#botmenu,#Pengantar,#Content,#right,#footer{width:320px} }</div>
<div>
<br /></div>
<div>
Width pada style diatas mengatur lebarnya komponen, bisa diedit sesuai keinginan. Ini hanya contoh dasar saja, anda masih bisa membuatnya lebih oke, menambahkan style yang lainnya pada komponen tertentu, misalnya kita akan menyembunyikan komponen #<span style="color: red;">botmenu</span>, maka tambahkan saja stylenya menjadi:</div>
<div>
<br /></div>
<div>
@media only screen and (Max-width : 320px)<br />
{#header,,#Pengantar,#Content,#right,#footer{width:100%}<span style="color: red;">#botmenu{display:none}</span> }</div>
<div>
<br /></div>
<div>
Artinya : <span style="color: red;">display:none</span> menjelaskan bahwa komponen bootmenu tidak ditampilkan pada perangkat dengan lebar<span style="color: red;"> </span>320px kebawah.</div>
<div>
<br /></div>
Ingin memaksimalkan pengetahuan anda, saya rekomendasikan membuka pelajaran dasar css di <a href="http://www.w3schools.com/css/%E2%80%8E" rel="nofollow" target="_blank">www.w3schools.com/css/</a></div>
<div>
<br />
<div style="text-align: center;">
<b>4. Langkah terakhir adalah Menyisipkan Css Responsive Kedalam Template</b></div>
</div>
<div>
<br />
<div>
Langkah Terakhir Modifikasi Template blogger Menjadi Rensponsive adalah menyisipkan kode css responsive yang telah kita buat tadi (<span style="color: red;">Media Query</span>) kedalam Template blogger anda.</div>
<div>
<br />
Dimanakah <span style="color: red;">Media Query</span> diletakkan?<br />
<br /></div>
<div>
Seperti biasa, masuk ke edit HTML template anda.</div>
<div>
<br /></div>
<div>
Letakkan didalam tempat kode style ...saya tidak menganjurkan anda menggunakan CTRL+F, tapi cari dan temukan manuali, untuk ketepatan dan kerapian mengingat blogger tampilan baru sekarang membungkus beberapa komponen.</div>
<div>
<br /></div>
<div>
Biasanya style dalam temlapte blogger jika terbungkus akan seperti ini <span style="color: #0b5394;"><style>...</style></span>. Cari dan Temukan, biasanya tidak jauh, paling beberapa baris dibawah header, dan ingat SAYA TIDAK MENGANJURKAN ANDA UNTUK menggunakan CTRL+F karna akan ada banyak, jadi usahakan</div>
<div>
anda temukan secara manual.<br />
<br />
Setelah menemukan <span style="color: #0b5394;"><style>...</style> </span>klik (yang diklik adalah titik-titik ...) antara pembuka dan penutup style tersebut. Jika itu benar maka style akan membuka.<br />
<span style="color: #0b5394;"><br /></span>
letakkan Media Query yang telah kita siapkan tadi tepat dibagian paling bawah style terbuka tersebut, sebelum penutup <span style="color: #0b5394;"></style>.</span><br />
<span style="color: red;">Contoh peletakkan:</span><br />
<span style="color: #0b5394;"><style></span><br />
<span style="color: #0b5394;">#cssblalalalalala{..}</span><br />
<span style="color: #0b5394;">#lain-lain{...}</span><br />
<div>
@media only screen and (Max-width : 320px)<br />
{#header,,#Pengantar,#Content,#right,#footer{width:100%}#botmenu{display:none} }</div>
<span style="color: #0b5394;"></style></span><br />
<br />
<h3 style="-webkit-box-shadow: rgb(255, 255, 255) 0px 1px 0px inset, rgb(255, 255, 255) 0px 1px 0px; background-color: #ebebeb; border-bottom-color: rgb(186, 186, 186); border-bottom-style: solid; border-top-color: rgb(186, 186, 186); border-top-style: solid; border-width: 1px 0px; box-shadow: rgb(255, 255, 255) 0px 1px 0px inset, rgb(255, 255, 255) 0px 1px 0px; color: #333333; font-family: inherit; font-size: inherit; font-style: inherit; font-variant: inherit; font-weight: inherit; line-height: 23.99305534362793px; margin: 0.25em 0px; outline: 0px; padding: 0.25em 0px; text-align: center; vertical-align: baseline;">
Download Template Responsive Blog Ini Secara Utuh</h3>
</div>
</div>
<div>
<br /></div>
<div>
Pelajaran hari ini selesai. Terima kasih anda menyempatkan diri untuk belajar bersama kami sebagai pemula blogger dalam membahas Modifikasi Template Menjadi Rensponsive. Seperti dikatakan diatas bahwa bagi anda yang ingin melihat langsung bagaimana perubahan yang telah saya lakukan untuk membuat template ini menjadi responsive? maka kami akan dengan senang hati berbagi. Tapi Karna ini bukan template share publik dan juga merupakan template source asli blog ini (http://blog.fispol.com/) tidak berbeda sedikit pun, maka kami tidak dapat menyediakan link downloadnya, khusus bagi pembaca kami untuk keperluan belajar dapat saya kirimkan lewat email...*Gratis kok :).</div>
<div>
<br /></div>
<div>
<span style="color: red;">TERIMA KASIH, SALAM SUKSES BUAT ANDA, TEMAN-TEMAN, DAN KELUARGA...</span></div>
<div>
<br /></div>
Unknownnoreply@blogger.com130