Pblegacy.Org™

Pblegacy.Org™ | Blog TravelBlogger di bawah payung Pblegacy Network™

Tutorial Blog : Cara Nak Buat AutoResize Gambar Pada Entri Atau Widgets

Assalamu'alaikum...

Kali ini pendekar akan ajar kalian bagaimana untuk membuat semua gambar pada setiap entri sama saiz ataupun tidak melebihi apa yang telah ditetapkan. Jika lebih, dikurangkan. Jika kurang, ditambahkan. Ia lebih kurang seperti Fit To Screen Image.

Caranya sangatlah mudah...iaitu...


Pertamanya : Ketahui Saiz yang anda kehendaki iaitu lebar, "width" dan panjang, "length".

contohnya, pendekar inginkan saiz image maksimum di entri ini adalah 470px lebar kali 260px panjang.

Code yang diperlukan adalah :
.resize {width: 100%; height : 260px;}
.resize {width: 470pxheight : 100%;}
Apabila code ini telah ada, dengan julat saiz yang dikehendaki, pergi ke DASHBOARD --&gt TEMPLATE ---&gt EDIT HTML tandakan kotak EXPAND WIDGETS TEMPLATE...


Kemudian Tekan CTRL + F dan cari code di bawah ini :

<style type='text/css'> ataupun 
<style type='text/javascript'>
Kemudian COPY PASTE kan code RESIZE yang telah diberikan di atas tadi di bawahnya seperti dalam gambar...


SEBELUM DILETAKKAN CODE class="resize"





Kemudian anda bolehlah mengupload gambar seberapa besar sekalipun atau seberapa kecil sekalipun dengan syarat menambahkan CODE seperti di bawah ke dalam setiap gambar gambar yang diupload.


class="resize"


Bagaimana untuk menambahkannya? Anda lihat di kotak kiri akan nampak COMPOSE dan HTML. Klik pada HTML dan anda akan jumpa seperti dalam gambar di bawah.


Selepas Diletakkan Code class="resize"


Ikuti Arahan yang diberikan. dan save atau publish entry anda..lihat perbezaannya di antara dua gambar di atas. 

Ingat, kaedah ini juga boleh digunakan untuk resize gambar pada widgets, sidebar atau header atau yang sebagainya. Caranya hanyalah dengan modified saiz resize ataupun anda boleh tambah satu lagi atau dua lagi resize dengan code resize2, resize3, atau sebagainya.

cara jalannya untuk resize2 dan resize3 sama sahaja dengan resize yang sebelum ini, cuma anda hanya perlu tambahkan code class="resize2" atau class="resize3" seperti dalam gambar di atas.

Selamat mencuba....

dan terima kasih kerana membaca....

12 Komentar untuk "Tutorial Blog : Cara Nak Buat AutoResize Gambar Pada Entri Atau Widgets "

bagus buat tuto cmnie sekurang2nya dpt membantu blogger yg memerlukan.hehe

wahhh rajinnya wat tuto ni.... ;)

Terima kasih maklumat ini,nanti bila start menulis semula boleh lah cuba.

terima kasih kerana sudi menyinggah... :-)

itulah tujuan yang sebenarnya... semoga dapat membantu... InsyaALLAH...

tak rajin sebenarnya...cuma bila ada masa terluang, buat tuto perlu juga... hehe...

sama-sama....cuba jangan tak cuba...moga bermanfaat...

dapat membantu pada yg perlu..Nice...

wuah! thanks pendekar...btul2 info berguna ni hihihi~ nak cubala~

info berguna untuk orang seperti saya..

Seni menghuraikan topik adalah curahan dari rasa hati yang merasa. Anda boleh memberikan maklumbalas sesuka hati anda. Tapi sebarang ulasan yang tidak berkaitan dengan topik mohon dielakkan. Begitu juga ulasan yang bersifat memalukan. Terima kasih kerana bekerjasama.

 
Copyright © 2014 - All Rights Reserved
Template By. Catatan Info - PB Networks - Buku Rujukan PTD