Saya ingin membuat thumbnail sudut bulat otomatis untuk proyek tertentu yang sedang saya kerjakan, menggunakan sesuatu seperti ini: http://webdeveloperplus.com/php/create-thumbnail-images-with-rounded-corners/
Idealnya saya ingin lakukan adalah menemukan cara untuk menghubungkan sesuatu seperti ini ke dalam proses pembuatan thumbnail itu sendiri dan cache itu serveride. /wp-includes/media.php
sepertinya tidak memiliki kait yang berlaku, jadi saya mungkin harus memutar sendiri.
Ada petunjuk di mana untuk memulai?
EDIT: Tidak dalam CSS. Ada beberapa saran bagus tentang ini, tetapi saya menggunakan radius perbatasan di seluruh situs, dan gambar-gambar khusus perlu dibulatkan di sisi server. Terima kasih
images
post-thumbnails
Dan Gayle
sumber
sumber
Jawaban:
Sepertinya Anda dapat menghubungkan ke
wp_create_thumbnail
filter :Jadi lakukan saja manipulasi Anda, dan kembalikan hasilnya ke
wp_create_thumbnail
.sumber
Meskipun Anda dapat memproses sudut bulat dengan Php dan gambar GD (Anda masih harus memilih warna latar belakang,) itu adalah banyak sekali pekerjaan / kode / pemrosesan untuk apa yang dapat dengan mudah dicapai dengan JavaScript atau CSS3.
Untuk gambar bulat di CSS3 Anda harus membungkus gambar dalam div dan menjadikan gambar itu sebagai gambar latar dari div itu, tidak terlalu praktis.
Jadi saya pikir Anda harus menggunakan jquery, cukup enqueue skrip saat diperlukan dan menambahkan kelas jquery ke thumbnail Anda melalui sebuah kail atau secara langsung.
Trik javascript / jquery pada dasarnya menerapkan 4 sudut gifs pada gambar untuk membuatnya tampak bulat. Ada berbagai jquery yang tergeletak di jalinan seperti http://maestric.com/doc/css/rounded_corners_images .
Hanya saja, jangan memberi tahu siapa pun mereka tidak benar-benar bulat.
sumber
border-radius
dapat diterapkan langsung ke tag IMG, tanpa masalah apa pun.Inilah pendapat saya tentang penggunaan salah satu filter gambar wordpress, saya mencoba menggunakan yang disarankan oleh Chip Bennett tetapi tidak berhasil.
Apa yang saya lakukan adalah membuat ukuran khusus dan kemudian memeriksa setiap gambar karena dibuat jika itu ukuran tertentu dan jika kemudian menerapkan filter phpthumb. Idealnya saya ingin dapat hanya memeriksa nama ukuran gambar kustom tapi saya belum tahu bagaimana melakukannya.
Jika Anda menambahkan kode itu ke file functions.php tema Anda, unduh phpthumb dan tetapkan jalur yang harus Anda tempuh. Saya sudah membuatnya bekerja pada instal lokal xampp saya jadi semoga itu bekerja untuk orang lain juga. Komentar phpThumb berasal dari contoh demo sederhana.
sumber
Tidak ada alasan untuk tidak melakukan ini dengan CSS berfungsi dan akan didukung di semua browser utama kecuali untuk IE 8 dan di bawah ini:
Jika Anda benar-benar ingin mendukung IE, Anda dapat menggunakan Modernizr yang akan menambahkan kelas no-rounded-corner pada elemen img target di browser yang tidak mampu.
Tambahkan class = "rounded-corner" ke thumbnail Anda dan di css Anda:
Saya melakukan tes cepat pada gambar acak di halaman depan WPCandy.com dengan menambahkan sudut ke kelas gambar menggunakan Firebug. Inilah hasilnya.
Sebelum:
Setelah:
CSS masuk ke Firebug:
Untuk .no-rounded-corner Anda gunakan salah satu metode mundur jika Anda merasa perlu.
sumber
Thumbnail apa yang ingin Anda gayakan, ukuran gambar "thumbnail" secara umum, atau Posting Thumbnail?
Keduanya dapat dengan mudah dicapai melalui CSS - khususnya,
border-radius
properti; jawaban spesifik akan tergantung pada kebutuhan Anda. Saya akan dengan senang hati memperbarui.PS IMHO pergi ke TimThumb / rute gambar cache di-sub-optimal. Cukup gunakan gambar WordPress yang dihasilkan, sudut-sudut (yang sudah menjadi bagian dari cache objek), dan gunakan CSS untuk mengitari sudut.
sumber
border-radius
berfungsi dengan baik pada gambar. Saya menggunakannya untuk komentar Gravatar di Tema saya sendiri.Setelah pencarian Google dimungkinkan untuk berbelok dengan GD tetapi hasilnya bukan yang terbesar; mereka agak jaggy; tapi itu panggilan subjektif di pihak saya: http://www.assemblysys.com/dataServices/php_roundedCorners.php
Jika Anda harus melakukan ini; saya sarankan menggunakan skrip timthumb sebagai titik awal:
Proyek Timthumb: http://timthumb.googlecode.com http://timthumb.googlecode.com/svn/trunk/timthumb.php
Stackoverflow juga memiliki pos tentang ini: /programming/609109/rounded-corners-on-images-using-php
sumber
Pernahkah Anda melihat ccs3pie Rounded Corners Dan CSS3 hacks yaitu ini harus melakukan apa yang Anda inginkan dan memaksa yang lama yaitu tunduk untuk tunduk.
sumber
OK ini mudah !!
Pertama seperti yang dikatakan orang, cara terbaik, terbersih, dan termudah adalah dengan menggunakan css3 border-radius. Ini berfungsi di sebagian besar browser modern, kecuali IE6-8 khas yang tidak memiliki dukungan ... meskipun IE9 akan melakukannya.
JADI, jika Anda seperti saya dan klien Anda semuanya menggunakan IE maka saya akan merekomendasikan Pie CSS3 seperti di atas http://css3pie.com/ . Satu-satunya kelemahan adalah itu berantakan dengan z-indeks gambar jadi jika Anda menggunakan slider yang memudar Anda mungkin mendapatkan masalah.
Jika Anda tidak suka menggunakan Pie CSS3, saya akan merekomendasikan http://jquery.malsup.com/corner/ . Anda cukup menautkannya di header Anda, bersama dengan jQuery dan menggunakan yang berikut ini:
Itu mengambil deklarasi CSS3 dan untuk browser apa pun yang tidak mendukungnya, itu membuat sudut bulat melalui jquery.
Kami baru-baru ini menggunakan keduanya di situs web klien di sini: http://www.theathenaprogramme.co.uk/
Pekerjaan selesai :-) Semoga ini bisa membantu.
Sunting: Hanya memperhatikan bahwa Anda perlu melakukan ini sebelum gambar disimpan melalui media.php. Pikirkan solusi saya tidak berlaku dalam kasus ini.
sumber
Saya telah menggunakan plugin Get Post Image untuk melakukan ini di sini: http://surfhatteras.com/
Get Post Image adalah pembungkus untuk Get The Image WordPress Plugin dan pustaka phpThumb.
Dengan menggunakannya Anda dapat melakukan sesuatu seperti
<?php get_post_image ('w=200&zc=1&fltr[]=ric|30|30'); ?>
membulatkan sudut-sudut gambar yang diposting. Atau Anda dapat membungkus gambar Anda sendiri: http://phpthumb.sourceforge.net/demo/demo/phpThumb.demo.demo.php#x33Jangan lupa untuk cache! http://mrphp.com.au/code/image-cache-using-phpthumb-and-modrewrite
sumber