Cara Mudah Menampilkan Google Maps di Web Pribadi


Pada Kesempatan kali ini saya akan menjelaskan sedikit mengenai cara menampilkan Google Maps di halaman web. Untuk sebuah perusahaan atau website yang dipakai untuk usaha peran google maps atau alamat asli dari tempat usaha atau perusahaan tersebut sangat penting, salah satunya untuk meyakinkan pengguna bahwa website kita ini merupakan website yang dapat dipertanggung jawabnya selain itu maps juga dapat berfungsi untuk mempermudah user untuk mencari alamat perusahaan.

contoh maps di dalam sebuah website.

google maps perusahaan

baiklah akan kita mulai cara membuatnya.

pertama buatlah daerah yang akan dijadikan sebagai tempat menyimpan maps tersebut. misalnya di dalam sebuah div atau elemen apapun.

misalnya :

<div id="maps-here" style="width:500px;height:380px;">
</div>

selanjutnya masukkan kode javascript berikut ini di ke dalam dokumen yang sama :
berikut ini adalah kode yang harus dimasukkan untuk menampilkan google maps sebaiknya masukkan kode di bawah ini di atas elemen sebelumnya.

<script src="http://maps.googleapis.com/maps/api/js"></script>
<script>
function initialize() {
  var mapProp = {
    center:new google.maps.LatLng(51.508742,-0.120850),
    zoom:5,
    mapTypeId:google.maps.MapTypeId.ROADMAP
  };
  var map=new google.maps.Map(document.getElementById("maps-here"),mapProp);
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>

Untuk mengubah alamatnya anda dapat mengubahnya di bagian

center:new google.maps.LatLng(51.508742,-0.120850)

ubah langitude dan latitudenya sesuai dengan alamat yang diinginkan.
contoh kode lengkap dari kode diatas sebagai berikut :

 <!DOCTYPE html>
<html>
<head>
<script src="http://maps.googleapis.com/maps/api/js"></script>
<script>
function initialize() {
  var mapProp = {
    center:new google.maps.LatLng(51.508742,-0.120850),
    zoom:5,
    mapTypeId:google.maps.MapTypeId.ROADMAP
  };
  var map=new google.maps.Map(document.getElementById("googleMap"),mapProp);
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
<div id="maps-here" style="width:500px;height:380px;"></div>
</body>
</html> 

selemat mencoba dan semoga berhasil. terimakasih telah berkunjung

Iklan

Apa itu Custom Post Type dan Custom Taxonomies di WordPress


Pada kesempatan kali ini saya akan mencoba membahas mengenai Custom Post Type. namun sebelumnya silahkan baca terlebih dahulu artikel sebelumnya mengenai perbedaan page dan post di WordPress seperti yang telah diketahui bahwa WordPress memiliki 2 jenis Post Type yaitu “post” dan “page” namun sebenarnya kita juga bisa membuat Post Type sendiri atau yang disebut dengan Custom Post Type misalnya custom post type “shop” atau semacamnya.

Custom Post Type inipun dapat dikelompokkan seperti halnya Post Type Post dengan menggunakan Taxonomies atau kategori atau biasa disebut Custom Taxonomies sehingga tiap Custom Post Type dapat memiliki Custom Taxonomy Sendiri dan dapat dikelompokan berdasarkan Custom Taxonomy masing-masing.

Untuk menambahkan atau meregister Custom Post Type dapat dilakukan dengan menggunakan Plugins atau dengan meregisternya sendiri. banyak sekali plugins yang tersedia untuk dapat membuat custom taxonomy dan custom post type ini misalnya Custom Post Type UI dll.

Sekian Pembahasan kali ini semoga bermanfaat selamat mencoba dan semoga sukses. terimakasih.

Perbedaan Page dan Post di WordPress


Saat pertama menggunakan WordPress mungkin kita akan bertanya apa sih bedanya Page dan Post itu ? bukannya fungsinya sama saja sebagai sebuah artikel atau halaman? apa bedanya sih? mungkin itu yang biasanya ditanyakan. namun ternyata post dan page di WordPress itu memiliki beberapa perbedaan yang memang cukup signifikan terutama dalam segi penggunaan.

Dalam istilah yang sering dipakai sendiri halaman biasanya disebut dengan post_type. kedua jenis halaman tersebut merupakan post_type default.
Continue reading “Perbedaan Page dan Post di WordPress”

Cara membuat menu widget sidebar sendiri di WordPress


Pada kesempatan hari ini saya akan mencoba menjelaskan sedikit mengenai cara membuat widget sendiri di WordPress. mungkin pembaca pernah mengalami sendiri ada beberapa keterbatasan jika menggunakan template hasil download yang diinginkan namun ada beberapa fitur yang kurang memadai misalnya widget yang disediakan hanya ada 1 buah saja atau bahkan tidak ada menu widget sama sekali tentunya sangat membingungkan jika harus mencari template yang lain. Continue reading “Cara membuat menu widget sidebar sendiri di WordPress”

Melihat statistik pengujung web dengan Google Analytics di WordPress


Berhubung hujan masih deras dan saya hanya bisa melamun menunggu hujan sedikit reda lebih baik saya membuat sesuatu. pada kesempatan kali ini saya akan mencoba membahas cara menggunakan Google Analytics di WordPress.

namun sebelumnya apa sih Google Analytics itu ? itu adalah sebuah fitur yang disediakan oleh google yang dapat digunakan untuk melihat statistik pengunjung website. secara lengkap dan mudah dimengerti. sebelum menc0banya terlebih dahulu anda harus sudah memiliki google account silahkan mendaftar di sini. namun jika sudah memilikinya mari kita lanjut. Continue reading “Melihat statistik pengujung web dengan Google Analytics di WordPress”

Memasukkan Kode Program ke dalam artikel di wordpress


Saat ini saya akan membahas mengenai Cara memasukkan kode PHP di dalam artikel di WordPress.com. untuk memasukkan kode ke dalam artikel di WordPress.com caranya sangat mudah sekali karena kita tidak perlu melakukan instalasi plugin. dan hanya tinggal menggunakannya saja. fitur ini sendiri biasanya disebut codehighlighter atau syntaxhighlighter dan lain-lain.

Cara menggunakannya pun sangat gampang tidak serumit di platform blogspot. berikut cara menggunakan syntaxhighlighter tersebut.

1. Masuk ke mode Text di Editor

2. Sebelum memasukkan kode masukkan tag ini diantara kode misalnya PHP yang akan dimasukkan ke dalam artikel.
dan akhiri dengan.
code
maka hasilnya akan nampak seperti kode di bawah ini.

<html>
<head>
<title>Percobaan Kode Highlighter</title>
</head>
<body>
<?php echo "Testing Kode Highlighter !" ?>
</body>
</html>

sekian dulu artikel kali ini semoga bermanfaat selamat mencoba dan semoga sukses