How to Change the CSS Style, Font, Spacing, Alignment and Color of WordPress Image Captions Cara Mengubah Gaya CSS, Font, Spasi, Alignment dan Warna dari Image Wordpress Keterangan
Since WordPress Sejak Wordpress version 2.6 Versi 2.6 , WordPress has added a built-in shortcode, “Caption”, which will be automatically rendered and translated into standard HTML CSS code to display the caption for the photo or image, which saved via media uploader, beneath it. , Wordpress telah menambahkan built-in singkat, "Keterangan", yang akan diberikan secara otomatis dan diterjemahkan ke dalam standar HTML CSS kode untuk menampilkan keterangan untuk foto atau gambar yang disimpan melalui media uploader, di bawah ini.
However, when WordPress appends the DIV styles to print the caption title under the picture or image, WordPress makes use of default alignment, color, font, spacing, and other styling attributes to display the image captions. Namun, bila Wordpress Div yang menambahkan gaya untuk mencetak judul keterangan di bawah gambar atau foto, Wordpress yang menggunakan standar alignment, warna, font, spasi, dan atribut lainnya styling untuk menampilkan gambar keterangan.
The default CSS styles for image with the caption may potentially breaks the blog or web page layout, does not validate against W3C xHTML standard, appears too closely with the text with no spacing in the post or page, or does not align as author's wish. Default style CSS untuk gambar dengan keterangan mungkin istirahat blog atau tata letak halaman web, tidak memvalidasi terhadap standar W3C XHTML, tampak terlalu dekat dengan teks tanpa spasi atau di halaman pos, atau tidak align sebagai penulis ingin.
For blogger who wants to modify the CSS styles of the caption that shows the image captions on screen after parsing the shortcode, add the following CSS code into the active theme's style.css file: Untuk blogger yang ingin memodifikasi CSS dari gaya keterangan yang menunjukkan gambar keterangan pada layar setelah parsing yang singkat, tambahkan kode berikut ke dalam CSS aktif dari file style.css:
/* Captions */
.aligncenter,
div.aligncenter {
display: block;
margin-left: auto;
margin-right: auto;
}
.wp-caption {
border: 1px solid #ddd;
text-align: center;
background-color: #f3f3f3;
padding-top: 4px;
margin: 10px;
-moz-border-radius: 3px;
-khtml-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
}
.wp-caption img {
margin: 0;
padding: 0;
border: 0 none;
}
.wp-caption p.wp-caption-text {
font-size: 11px;
line-height: 17px;
padding: 0 4px 5px;
margin: 0;
}
/* End captions */
Above HTML CSS declaration is taken from WordPress 2.6 default theme. HTML CSS pernyataan di atas diambil dari Wordpress 2,6 standar tema. These newly added CSS styles are used to control and assign the appearance of the caption for the image posted on blog. Ini gaya baru ditambahkan CSS digunakan untuk menetapkan kontrol dan tampilan pada keterangan gambar untuk diposting di blog. Modify the code above in “style.css” file according to your own preference to have your own design and look. Ubah kode di atas dalam "style.css" file menurut preferensi Anda sendiri agar memiliki desain dan tampilan.
IMPORTANT : The page is machine translated and provided "as is" without warranty. PENTING: Halaman yang diterjemahkan mesin dan diberikan "sebagaimana adanya" tanpa jaminan. Machine translation may be difficult to understand. Mesin terjemahan mungkin sulit dimengerti. Please refer to Silakan merujuk ke original English article artikel asli Inggris whenever possible. bila memungkinkan.
Related Articles Artikel Terkait
- How to Disable Image and Video Captions Feature and Auto Adding of Shortcode in WordPress 2.6 Bagaimana foto dan video Nonaktifkan Keterangan Fitur dan Otomatis Menambahkan yang singkat di Wordpress 2,6
- Caption Disabler WordPress Plugin to Disable and Remove Captions Functionality Keterangan Disabler Wordpress Plugin untuk Nonaktifkan dan Hapus Keterangan Fungsi
- Switch and Change Back to Office 2003 Default Font and Style Set in Office Word 2007 Ubah Kembali dan beralih ke Office 2003 Default font dan Gaya Tetapkan di Kantor Word 2007
- How to Change the Frequency or Interval WordPress Auto Saves An Editing Post or Page Cara Mengubah Frekuensi atau jarak Wordpress Auto Menyimpan An Editing Post atau Page
- Download ING Change Font to Personalize your Windows Mobile Device Download ING Change font Personalisasikan Anda ke Windows Mobile Device
- How to Customize, Modify or Change WordPress Database Connection Error Page Bagaimana Customize, Ubah atau Ubah Wordpress Database Error Koneksi Halaman
- WordPress 2.6 with Change Revision Tracking Feature Available for Free Download Ganti dengan Wordpress 2,6 Revisi Pelacakan Fitur Tersedia untuk Download Gratis
- Paginating or Split WordPress Post or Page with NextPage in WordPress Not Working Split atau Paginating Wordpress Post atau Page di Wordpress dengan Nextpage Tidak Bekerja
- AdSense New Ads Style with Horizontal Image and Ad Links AdSense Baru Kemarin Gaya Horisontal dengan gambar dan Link Iklan
- 3 Column Relaxation WordPress Theme comments-paged.php for Paged-Comments WordPress Plugin 3 Column Wordpress Theme Relaxation komentar-paged.php untuk Paged-Komentar Wordpress Plugin










































October 27th, 2008 18:05 27 Okt 2008 18:05
Wow, klasse für den CSS-Tipp. Wow, klasse für den CSS-Tipp. Habe den gleiche mal eingebaut und finde die Formatierung einfach klasse. Habe den gleiche mal eingebaut und finde die Formatierung Einfach klasse. Sieht optisch sehr ansprechend aus. Sieht optisch Sehr ansprechend aus.
Danke und gruss Danke und Gruß
September 16th, 2008 01:05 September 16, 2008 01:05
Thank you so much for sharing this code! Thank you so much untuk berbagi kode ini! I was going nuts trying to figure out how to fix my captions! I was going nuts mencoba untuk mengetahui bagaimana memperbaiki keterangan saya!
July 20th, 2008 10:05 20 Jul 2008 10:05
For the life of me, I cannot get captions to work. Untuk kehidupan saya, saya tidak bisa mendapatkan keterangan untuk bekerja. It looks great in preview, but live, all the code spills out around the photo and there's no caption at all. Tampaknya besar di awal, tetapi hidup, semua kode spills out sekitar foto dan tidak ada keterangan sama sekali. I added the caption code to my theme's style.css but there was no change. Saya menambahkan keterangan kode ke Kontak tema dari style.css tapi tidak ada perubahan. Seems like I'm just one minor step away from making this work. Seems like I'm just satu langkah kecil dari membuat karya ini. If anyone has any ideas, I'd love to hear them. Jika seseorang mempunyai ide, saya ingin mendengar mereka. I'll add a caption to my first post to demonstrate. Saya akan menambahkan keterangan untuk posting pertama saya untuk membuktikan.