Tutorial Blog: Membuat Banner (small banner linked to blog)

Post on 12-Aug-2015

105 views 1 download

Transcript of Tutorial Blog: Membuat Banner (small banner linked to blog)

1

Membuat Banner(small banner linked to blog)

Presenter: Almazia

2

Banner : gambar yang mewakili blog kita (bisa berupa logo atau lainnya) yang mengandung link

URL blog kita. Jika banner ini dipasang di blog lain akan berfungsi

sebagai backlink.

Backlink merupakan salah satu faktor penentu Domain Authority (DA). Jika banner blog kita

terpasang di banyak blog/website lain, DA blog kita akan semakin baik.

www.bloggerperempuan.com

3

1. Membuat banner (image)

2. Membuat grab box banner kita di blog

3. Membuat laman khusus yang memuat banner blog-blog lain (tukar-menukar backlink) untuk saling

membantu meningkatkan DA

Apa saja yang akan dilakukan?

www.bloggerperempuan.com

4

1. Membuat banner, pakai apa?

Premium Software:Adobe Photoshop, Adobe Illustrator

Free Software :Computer-based: GIMP (serupa dengan Photoshop)

Web-based: Canva, Pixlr, PicMonkey

www.bloggerperempuan.com

Contoh banner yang dibuat dengan Canva

www.bloggerperempuan.com

6

Upload banner di server, catat direct image URL-nya

Blogspot

• Buat post baru / new entry• Upload banner• Klik tab HTML, simpan direct image

URL-nya (bagian yang di-highlight biru)

• Post ini jangan di-delete dan jangan di-publish

Wordpress

• Upload banner ke Media Library• Simpan direct image URL-nya

www.bloggerperempuan.com

Membuat Grab Box Untuk Banner Blog Kita

1. Copy paste template kode HTML untuk Grab Box dari sini :

http://bit.ly/1KP0aUg

www.bloggerperempuan.com

8

<a href="LINK TO BLOG" target="_blank" title="BLOG NAME"><img style="width: WIDTHpx; height: HEIGHTpx;" alt="DESCRIPTION/BLOG NAME" src="DIRECT URL TO IMAGE LINK" /></a><br /><textarea style="width: WIDTH OF BOXpx; height: HEIGHT OF BOXpx;" id="code-source" rows="3" cols="13" name="code-source"> &lt;a href=&quot;LINK TO BLOG&quot;&gt;&lt;img src=&quot; DIRECT URL TO IMAGE LINK&quot; border=&quot;0&quot;&gt;&lt;/a&gt; </textarea>

LINK TO BLOG : http://www.bloggerperempuan.co/marketplace

BLOG NAME : Blogger Perempuan Marketplace

WIDTH & HEIGHT : 125 & 125 >> tergantung ukuran banner yang dibuat

DIRECT URL TO IMAGE LINK : http://bloggerperempuan.com/wp-content/uploads/2015/07/Logo-BP-Marketplace-1.jpg

WIDTH OF BOX & HEIGHT OF BOX : 250 & 125 >> lebar sesuai sidebar, tinggi-nya kira-kira setengahnyaLINK TO BLOG http://www.bloggerperempuan.co/marketplace

DIRECT URL TO IMAGE LINK : http://bloggerperempuan.com/wp-content/uploads/2015/07/Logo-BP-Marketplace-1.jpg

Ganti bagian yang berwarna pada kode HTML di atas dengan data yang sesuai, contohnya sbb :

www.bloggerperempuan.com

9

Blogspot

• Tambahkan gadget di sidebar• Pilih gadget HTML/JavaScript• Isi dengan kode HTML grab box

yang dibuat tadi.

Wordpress

• Appearance >> Widget

• Seret Text Widget ke Primary Sidebar

• Isi dengan kode HTML grab box yang dibuat tadi.

2. Copy paste kode HTML untuk Grab Box di widget / gadget

sidebar

www.bloggerperempuan.com

Grab Box

www.bloggerperempuan.com

1. Buat Laman / Page baru, beri judul misalnya Blogwalking

2. Copy paste kode HTML banner blog lain (dari grab box masing-masing blog) ke laman baru tersebut

Membuat Laman / Page khusus untuk memuat banner blog-blog

lain

www.bloggerperempuan.com

12

www.bloggerperempuan.com

BloggerPerempuanCom

bperempuan

bloggerperempuan

www.bloggerperempuan.co/marketplace

kontak@bloggerperempuan.com