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.


3 Responses to “How to Change the CSS Style, Font, Spacing, Alignment and Color of WordPress Image Captions” 3 Responses to "Bagaimana Mengubah Gaya CSS, Font, Spasi, Alignment dan Warna dari Wordpress Keterangan foto"

  1. Browsergames Fan Browsergames Fan
    October 27th, 2008 18:05 27 Okt 2008 18:05
    3 3

    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ß

  2. Gray Gray
    September 16th, 2008 01:05 September 16, 2008 01:05
    2 2

    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!

  3. Mark LaFlamme Tandai LaFlamme
    July 20th, 2008 10:05 20 Jul 2008 10:05
    1 1

    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.

Leave a Reply Meninggalkan Balas

You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> Anda dapat menggunakan tag ini: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime = ""> <em> <i> <q cite=""> <strike> <strong>

Subscribe to comments feature has been disabled. Berlangganan ke fitur komentar telah dinonaktifkan. To receive notification of latest comments posted, subscribe to Untuk menerima pemberitahuan komentar diposting terbaru, berlangganan My Digital Life Comments RSS feed Saya Digital Life Komentar RSS feed or atau register to receive mendaftar untuk menerima new comments in daily email digest. komentar baru di email harian digest.
Custom Search

New Articles Artikel Baru

Incoming Search Terms for the Article Cari Syarat masuk untuk Artikel

css font color css warna font - -- font color css warna font css - -- css font spacing css font spacing - -- css style font color css gaya warna font - -- css font align css font align - -- css change font color css mengubah warna font - -- font color in css warna font di css - -- css alignment css alignment - -- div style font color div style warna font - -- change font color wordpress mengubah warna font wordpress - -- style font color gaya warna font - -- css font color code css kode warna font - -- change font color css mengubah warna font css - -- how to change font color in css cara untuk mengubah warna font di css - -- css font-color css font-warna - -- font-color css font-warna css - -- set font color in css mengatur warna font di css - -- how to change font in css cara mengubah font di css - -- CSS font color style CSS warna font style - -- wordpress change font color wordpress mengubah warna font - -- change css style css mengubah gaya - -- Wordpress CSS styles CSS wordpress gaya - -- css font alignment css font alignment - -- change CSS mengubah CSS - -- font spacing css font spacing css - -- font color css code warna font css kode - -- wp-caption css wp-keterangan css - -- change font css mengubah font css - -- style font spacing gaya font spacing - -- font align css font align css - -- css change color css mengubah warna - -- style font align gaya font align - -- css font margin css font margin - -- css changing font color css mengubah warna font - -- change font spacing mengubah font spacing - -- set font color CSS mengatur warna font CSS - -- css color change css mengubah warna - -- change color css mengubah warna css - -- css set font color css mengatur warna font - -- css change font colour css mengubah warna font - -- change font color in wordpress mengubah warna font di wordpress - -- css style font css gaya font - -- code to change font color kode untuk mengubah warna font - -- changing font color css mengubah warna font css - -- change font in css mengubah font di css - -- how to change css style cara mengubah gaya css - -- wordpress change font wordpress mengubah font - -- CSS to change font color CSS untuk mengubah warna font - -- css font colour Warna font css - -- font colors in css warna font di css - -- style css font color gaya css warna font - -- change wordpress font color wordpress mengubah warna font - -- spacing CSS spacing CSS - -- how to change font size css cara mengubah ukuran font css - -- how to change css styles cara mengubah gaya css - -- changing font color with css mengubah warna font dengan css - -- font color in css file warna font di css file - -- css code for font color css code untuk warna font - -- font color with css warna font dengan css - -- change css style css mengubah gaya - -- code to change font and font color kode untuk mengubah font dan warna font - -- wp-caption style wp-keterangan gaya - -- css font color change css mengubah warna font - -- how to change wordpress css cara mengubah wordpress css - -- style font color css gaya warna font css - -- Wordpress CSS style CSS wordpress gaya - -- css code for changing font color kode css untuk mengganti warna font - -- how to set font color in CSS cara menetapkan warna font di CSS - -- changing color in css mengubah warna dalam css - -- setting font color in css pengaturan warna font di css - -- how to change font color on wordpress cara untuk mengubah warna font pada wordpress - -- CSS CODE TO CHANGE COLOR CSS KODE WARNA TO CHANGE - -- changing font colors in css mengubah warna font di css - -- change wordpress theme font mengubah tema wordpress font - -- style sheet font color gaya warna font - --