Credit to this owner yang baik hati, unwanted
Buka Link Baru Apabila Klik Pada Gambar
Apabila upload gambar menggunakan kaedah yang telah tersedia oleh blogger.com, secara default gambar tersebut akan dibuka pada page yang sama.
Ada ketikanya ianya bagus apabila merujuk kepada blog yang sama, tetapi kurang bagus apabila seorang blogger hendak merujuk kepada tempat lain. ini kerana apabila buka pada page yang sama, pengunjung terpaksa menekan button back untuk kembali kepada blog asal.
Tutorial ini akan menerangkan bagaimana untuk menjadikan gambar yang mempunyai link akan dibuka pada tab yang baru apabila diklik.
Perhatikan kedua-dua gambar ini, sila klik pada keduanya.
1)Gambar 1
2)Gambar 2
Gambar pertama tidak memberi kesan apa², tetapi gambar kedua membawa anda ke yahoo.com .(memang sengaja di'link'kan kepada yahoo).
Jangan terkejut jika tutorial ini sangat mudah.:)
Now there's a practical tutorial!
How to place different background picture for each post? Or how to make each post appear in different color?
Here's the example: different background in each blogger post...
WHEN IS THIS CONVENIENT?
► if you want to make a specific post stand-out (like a theme post)
► when you have multiple authors in a Blog, this is an easy way to unify the Post appearance according to each author
► this method can also be used just to highlight just the part of the Post
► and anything else you can think of......this can really break dullness of the regular Posts....
HOW TO DO IT?
It's done by wrapping your Post content into a "div" element. You can apply these setting to your already published posts, too....and change/remove it anytime....
Code for Changing the Color of the Post Background
Your text goes here.......in orange is the line you have to place at the BEGINNING of your post....
...in pink is the line you have to place at the END...
...replace the part in green with preferred color hex value...
...instead of "Your text here...." you will place your Post content, of course...
...we've added some padding, so the text is not too close to the borders...
Code for placing the Background image behind the Post
Your text goes here.......in green, you need to place the URL address of your hosted picture (use Photobucket,Tinypic...)
...in orange is the line you have to place at the BEGINNING of your post....
...in pink is the line you have to place at the END...
...instead of "Your text here...." you will place your Post content, of course...
Now, you have some more options here...
► you can use small pattern, and set it to repeat across the Post area (just remove "no repeat" from the code)
► you can position the picture and place it in desired location inside the Post (background pictures in blogger)
► combine color + background picture (background:#000000 url(URL ADDRESS)no-repeat;)
Here's the example of the placed code in the Post Edit box:
► my advice is to do the code placing when you're done with composing the post
► do it in EDIT HTML Post editor
► if you go back to edit the code, you will notice that the Blogger slightly changed the code....no worries, it's the same thing, just the different looks...
Smile!
Ada ketikanya ianya bagus apabila merujuk kepada blog yang sama, tetapi kurang bagus apabila seorang blogger hendak merujuk kepada tempat lain. ini kerana apabila buka pada page yang sama, pengunjung terpaksa menekan button back untuk kembali kepada blog asal.
Tutorial ini akan menerangkan bagaimana untuk menjadikan gambar yang mempunyai link akan dibuka pada tab yang baru apabila diklik.
Perhatikan kedua-dua gambar ini, sila klik pada keduanya.
1)Gambar 1
2)Gambar 2
Gambar pertama tidak memberi kesan apa², tetapi gambar kedua membawa anda ke yahoo.com .(memang sengaja di'link'kan kepada yahoo).
Jangan terkejut jika tutorial ini sangat mudah.:)
Sebagai contoh, untuk kod gambar kedua adalah seperti ini
- Untuk gambar kedua, link akan dibuka pada tab baru. Jika anda ingin link dibuka pada page yang sama, buang target="_blank"
- Kaedah lain untuk buka link dalam page yang sama boleh guna terus aplikasi upload gambar dan letak link yang ada masa buat new post.:)
Letak Gambar Sebelah Tajuk Entri
Tajuk entri adalah antara perkara yang pertama dinilai oleh seseorang pengunjung yang mengunjungi sesebuah blog. Disamping mempunyai tajuk-tajuk entri yang gempak², kehadiran penghias juga dapat menambahkan lagi seri pada entri tersebut.
Antara salah satu perkara untuk menambahkan seri tajuk entri adalah dengan meletakkan gambar disebelah tajuk entri.
Contoh:
Berikut adalah langkah-langkah yang perlu dilakukan.
1.Login akaun blogger, dari dashboard >layout > edit html > expand widget templates
2.Tekan ctrl + F untuk menghidupkan fungsi 'find' kemudian cari kod berikut.
Nota:
a. Tukarkan 'url gambar' dengan url gambar yang anda kehendaki
b. Saiz gambar yang biasa digunakan adalah dalam lingkungan 20x20 hingga 30x30.
4. Preview, dan jika anda berpuas hati klik save template.:)
Antara salah satu perkara untuk menambahkan seri tajuk entri adalah dengan meletakkan gambar disebelah tajuk entri.
Contoh:
Berikut adalah langkah-langkah yang perlu dilakukan.
1.Login akaun blogger, dari dashboard >layout > edit html > expand widget templates
2.Tekan ctrl + F untuk menghidupkan fungsi 'find' kemudian cari kod berikut.
3. Letakkan kod dibawah antara kod dan kod
Contoh kod sepatutnya kelihatan seperti ini
Nota:
a. Tukarkan 'url gambar' dengan url gambar yang anda kehendaki
b. Saiz gambar yang biasa digunakan adalah dalam lingkungan 20x20 hingga 30x30.
4. Preview, dan jika anda berpuas hati klik save template.:)
Each Post in Different Color or with Different Background
December 23, 2008
Now there's a practical tutorial!
How to place different background picture for each post? Or how to make each post appear in different color?
Here's the example: different background in each blogger post...
WHEN IS THIS CONVENIENT?
► if you want to make a specific post stand-out (like a theme post)
► when you have multiple authors in a Blog, this is an easy way to unify the Post appearance according to each author
► this method can also be used just to highlight just the part of the Post
► and anything else you can think of......this can really break dullness of the regular Posts....
HOW TO DO IT?
It's done by wrapping your Post content into a "div" element. You can apply these setting to your already published posts, too....and change/remove it anytime....
Code for Changing the Color of the Post Background
Your text goes here....
...in pink is the line you have to place at the END...
...replace the part in green with preferred color hex value...
...instead of "Your text here...." you will place your Post content, of course...
...we've added some padding, so the text is not too close to the borders...
Code for placing the Background image behind the Post
Your text goes here....
...in orange is the line you have to place at the BEGINNING of your post....
...in pink is the line you have to place at the END...
...instead of "Your text here...." you will place your Post content, of course...
Now, you have some more options here...
► you can use small pattern, and set it to repeat across the Post area (just remove "no repeat" from the code)
► you can position the picture and place it in desired location inside the Post (background pictures in blogger)
► combine color + background picture (background:#000000 url(URL ADDRESS)no-repeat;)
Here's the example of the placed code in the Post Edit box:
► my advice is to do the code placing when you're done with composing the post► do it in EDIT HTML Post editor
► if you go back to edit the code, you will notice that the Blogger slightly changed the code....no worries, it's the same thing, just the different looks...
Smile!
