{"id":10026,"date":"2020-07-20T14:02:27","date_gmt":"2020-07-20T14:02:27","guid":{"rendered":"https:\/\/blog.hostinger.io\/co-id-tutorial\/?p=10026"},"modified":"2025-12-18T23:32:30","modified_gmt":"2025-12-18T16:32:30","slug":"cara-upload-svg-wordpress","status":"publish","type":"post","link":"\/id\/tutorial\/cara-upload-svg-wordpress","title":{"rendered":"Cara upload SVG ke WordPress: 2 metode aman &#038; mudah"},"content":{"rendered":"<p>Apabila menangani pengelolaan dan desain web, Anda pasti sering menggunakan berbagai format file media. Nah, SVG adalah salah satu format terpopuler saat ini, yaitu file vektor berbasis XML. Sayangnya, tidak semua browser dan platform mendukung SVG sehingga Anda perlu mengaktifkan dukungannya dulu secara manual.<\/p><p>Tenang, di artikel ini kami akan membahas cara upload file SVG di WordPress menggunakan plugin SVG Support. Kami juga akan menjawab beberapa pertanyaan mengenai masalah keamanan format file ini dan kelebihan SVG.<\/p><p>Sebelum lanjut ke cara mengunggah file SVG di WordPress, mari cari tahu dulu apa itu SVG dan cara kerjanya. Yuk, scroll ke bawah!<\/p><h2 class=\"wp-block-heading\" id=\"h-apa-itu-svg\">Apa Itu SVG?<\/h2><p>Scalable Vector Graphics atau SVG adalah format gambar grafis vektor berbasis teks XML. Sementara format gambar umum seperti JPG dan PNG tersusun dari banyak kotak kecil yang disebut piksel, SVG menggunakan bahasa markup XML untuk mendeskripsikan atribut gambar.<\/p><p>Sejak Januari 2022, <a target=\"_blank\" rel=\"noreferrer noopener\" href=\"https:\/\/w3techs.com\/technologies\/details\/im-svg\">42%<\/a> dari semua website di seluruh dunia sudah menggunakan SVG. Persentase ini meningkat dibandingkan dengan Januari 2021, dengan hanya <a target=\"_blank\" rel=\"noreferrer noopener\" href=\"https:\/\/w3techs.com\/technologies\/history_overview\/image_format\/all\">29,4% <\/a>website yang menggunakannya.<\/p><p>Mirip dengan PNG dan JPG, SVG banyak digunakan di website dengan traffic tinggi seperti Google, Wikipedia, dan YouTube.<\/p><p>Hal keren lainnya tentang SVG adalah format ini didukung oleh hampir semua browser utama. Berikut adalah <a href=\"https:\/\/caniuse.com\/svg\" target=\"_blank\" rel=\"noreferrer noopener\">daftar browser<\/a> yang mendukung SVG:<\/p><figure tabindex=\"0\" class=\"wp-block-table\"><table><tbody><tr><td><strong>Browser<\/strong><\/td><td><strong>Dukungan Sebagian<\/strong><\/td><td><strong>Dukungan Penuh<\/strong><\/td><\/tr><tr><td>Edge<\/td><td>&ndash;<\/td><td>Versi 12-18, 79-96, 97<\/td><\/tr><tr><td>Firefox<\/td><td>Versi 2<\/td><td>Versi 3-94, 95, 96-97<\/td><\/tr><tr><td>Firefox Android<\/td><td>&ndash;<\/td><td>Versi 95<\/td><\/tr><tr><td>Chrome<\/td><td>&ndash;<\/td><td>Versi 4-96, 97, 98-100<\/td><\/tr><tr><td>Chrome Android<\/td><td>&ndash;<\/td><td>Versi 96<\/td><\/tr><tr><td>Safari<\/td><td>Versi 3.1<\/td><td>Versi 3.2-15.1, 15.2, TP<\/td><\/tr><tr><td>Opera<\/td><td>&ndash;<\/td><td>Versi 10-81, 82<\/td><\/tr><tr><td>Opera Mini<\/td><td>&ndash;<\/td><td>Semua versi<\/td><\/tr><tr><td>Opera Mobile<\/td><td>&ndash;<\/td><td>Versi 12-12.1, 64<\/td><\/tr><tr><td>Safari di iOS<\/td><td>&ndash;<\/td><td>Versi 3.2-15.1, 15.2<\/td><\/tr><tr><td>Browser Android<\/td><td>Versi 3-4.3<\/td><td>Versi 4.4-4.4.4, 96<\/td><\/tr><tr><td>UC Browser Android<\/td><td>&ndash;<\/td><td>Versi 12.12<\/td><\/tr><tr><td>Samsung Internet<\/td><td>&ndash;<\/td><td>Versi 4-14.0, 15.0<\/td><\/tr><tr><td>QQ Browser<\/td><td>&ndash;<\/td><td>Versi 10.4<\/td><\/tr><tr><td>Baidu Browser<\/td><td>&ndash;<\/td><td>Versi 7.12<\/td><\/tr><tr><td>KaiOS Browser<\/td><td>&ndash;<\/td><td>Versi 2.5<\/td><\/tr><\/tbody><\/table><\/figure><h2 class=\"wp-block-heading\" id=\"h-cara-kerja-svg\">Cara Kerja SVG<\/h2><p>SVG menggunakan XML untuk menghasilkan gambar vektor dua dimensi. Berbeda dengan JPG dan PNG, grafis vektor tidak terdiri dari piksel. Sebaliknya, perilakunya dijelaskan dalam file teks XML.<\/p><p>Oleh karena itu, file SVG bisa dicari, diindeks, diprogram, diedit, dan dikompresi seperti kode. Jadi, siapa pun bisa membuatnya menggunakan editor teks atau software grafis vektor.<\/p><h2 class=\"wp-block-heading\" id=\"h-apakah-wordpress-mendukung-svg\">Apakah WordPress Mendukung SVG?<\/h2><p>Tidak, WordPress tidak mendukung SVG secara default karena risiko keamanan yang mungkin timbul. Kami akan membahas lebih lanjut tentang masalah keamanan SVG nanti di bagian lain dalam artikel ini.<\/p><p>Berikut adalah pesan error yang muncul saat mengupload file SVG di WordPress:<\/p><div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img decoding=\"async\" width=\"1024\" height=\"164\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/37\/2023\/12\/error-svg-wordpress.png\/public\" alt=\"error svg wordpress\" class=\"wp-image-32903\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/37\/2023\/12\/error-svg-wordpress.png\/w=1024,fit=scale-down 1024w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/37\/2023\/12\/error-svg-wordpress.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/37\/2023\/12\/error-svg-wordpress.png\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/37\/2023\/12\/error-svg-wordpress.png\/w=768,fit=scale-down 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure><\/div><p>Memang, sudah ada <a href=\"https:\/\/core.trac.wordpress.org\/ticket\/24251\" target=\"_blank\" rel=\"noreferrer noopener\">pembahasan<\/a> untuk mengintegrasikan SVG sebagai bagian dari fitur inti WordPress. Namun, untuk saat ini, user perlu mencari solusi lain guna mengupload gambar SVG ke WordPress.<\/p><h2 class=\"wp-block-heading\" id=\"h-mengapa-perlu-menggunakan-svg-wordpress\">Mengapa Perlu Menggunakan SVG WordPress<\/h2><div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img decoding=\"async\" width=\"768\" height=\"274\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/37\/2023\/12\/perbandingan-svg.png\/public\" alt=\"perbandingan svg\" class=\"wp-image-32904\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/37\/2023\/12\/perbandingan-svg.png\/w=768,fit=scale-down 768w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/37\/2023\/12\/perbandingan-svg.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/37\/2023\/12\/perbandingan-svg.png\/w=150,fit=scale-down 150w\" sizes=\"(max-width: 768px) 100vw, 768px\" \/><\/figure><\/div><p>Meskipun rentan masalah keamanan, banyak user yang suka menggunakan format gambar ini karena memiliki banyak manfaat. Berikut adalah beberapa kelebihan file SVG:<\/p><ul class=\"wp-block-list\">\n<li><strong>Mudah diatur sesuai kebutuhan<\/strong> &ndash; karena SVG adalah format gambar vektor, kualitasnya akan tetap sama di semua resolusi layar, termasuk saat diubah ukurannya. Karena itulah, banyak orang yang memanfaatkannya untuk ikon dan logo.<\/li>\n\n\n\n<li><strong>Ukuran file yang lebih kecil<\/strong> &ndash; menggunakan file SVG akan membantu meningkatkan performa website karena hanya membutuhkan sedikit ruang penyimpanan web dan bisa dimuat jauh lebih cepat daripada gambar raster.<\/li>\n\n\n\n<li><a href=\"\/id\/tutorial\/cara-seo-wordpress\">SEO-friendly<\/a> &ndash; Google mengindeks file SVG, memungkinkannya muncul di Pencarian Gambar Google dan memaksimalkan strategi SEO Anda. Dengan gambar raster, Anda hanya bisa mengoptimasi alt attribute file media di website.<\/li>\n\n\n\n<li><strong>Berbasis kode<\/strong> &ndash; SVG bisa dimodifikasi menggunakan editor teks atau software editing grafik vektor. Anda bisa mengoptimalkan file gambar SVG untuk website, atau bahkan menambahkan animasi agar gambar menjadi interaktif.<\/li>\n<\/ul><h2 class=\"wp-block-heading\" id=\"h-svg-wordpress-dan-keamanannya\">SVG WordPress dan Keamanannya<\/h2><p>Karena pada dasarnya SVG adalah file teks XML, format ini memiliki kerentanan yang bisa dieksploitasi, tidak seperti format gambar lainnya. Akibatnya, hacker bisa dengan mudah meretasnya dengan kode jahat untuk melancarkan serangan XSS (cross-site scripting) dan XXE (XML external entity) pada sistem Anda.<\/p><p>Jadi, Anda perlu berhati-hati saat menangani file SVG dan menambahkannya ke WordPress.<\/p><p>Untuk meminimalkan risiko keamanan, pastikan Anda membersihkan file SVG sebelum menguploadnya ke media library WordPress. Dalam proses ini, Anda akan menghilangkan kode yang mencurigakan dan error sehingga file menjadi lebih aman untuk website.<\/p><p>Untuk melakukannya, Anda bisa menggunakan plugin SVG, yang caranya akan kami bahas nanti. Namun, kami merekomendasikan agar Anda membersihkannya dua kali dengan <a href=\"https:\/\/svg.enshrined.co.uk\/\" target=\"_blank\" rel=\"noreferrer noopener\">SVG Sanitizer Test<\/a>, tool online yang dikembangkan oleh developer WordPress, Darryll Doyle.<\/p><p>Cara lain untuk <a href=\"\/id\/tutorial\/cara-mengamankan-wordpress\/\">mengamankan website WordPress<\/a> adalah dengan membatasi upload SVG hanya untuk user tertentu. User yang dipilih harus cermat terhadap masalah keamanan format SVG agar tidak asal-asalan memasukkan file SVG dari sumber yang tidak tepercaya.<\/p><h2 class=\"wp-block-heading\" id=\"h-cara-upload-svg-ke-wordpress-2-metode-aman\">Cara Upload SVG ke WordPress (2 Metode Aman)<\/h2><p>Secara teknis, ada dua cara upload SVG ke WordPress: menggunakan plugin atau mengaktifkannya secara manual. Mana pun pilihan Anda, sangat disarankan untuk membatasi hak upload hanya bagi administrator dan user terpercaya guna mengurangi risiko file berbahaya.<\/p><h3 class=\"wp-block-heading\" id=\"h-menggunakan-plugin\">Menggunakan Plugin<\/h3><p>Di tutorial ini, kami menggunakan plugin <a target=\"_blank\" rel=\"noreferrer noopener\" href=\"https:\/\/wordpress.org\/plugins\/svg-support\/\">SVG Support<\/a>. Plugin ini menggunakan library pembersih SVG yang akan otomatis aktif saat upload file SVG ke WordPress di media library. Selain itu, plugin ini mudah diatur dan tersedia gratis.<\/p><p>Berikut adalah langkah-langkah setup plugin SVG Support:<\/p><ol class=\"wp-block-list\">\n<li><a href=\"\/id\/tutorial\/cara-install-plugin-wordpress\">Install dan aktifkan plugin WordPress<\/a> ini.<\/li>\n<\/ol><div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img decoding=\"async\" width=\"577\" height=\"272\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/37\/2023\/12\/plugin-svg-support.png\/public\" alt=\"plugin svg support\" class=\"wp-image-32905\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/37\/2023\/12\/plugin-svg-support.png\/w=577,fit=scale-down 577w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/37\/2023\/12\/plugin-svg-support.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/37\/2023\/12\/plugin-svg-support.png\/w=150,fit=scale-down 150w\" sizes=\"(max-width: 577px) 100vw, 577px\" \/><\/figure><\/div><ol class=\"wp-block-list\" start=\"2\">\n<li>Buka <strong>Settings<\/strong> (Pengaturan) -&gt; <strong>SVG<\/strong> <strong>Support<\/strong> dari dashboard WordPress.<\/li>\n<\/ol><div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img decoding=\"async\" width=\"341\" height=\"310\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/37\/2023\/12\/svg-support-di-dashboard-wp.png\/public\" alt=\"svg support di dashboard wp\" class=\"wp-image-32906\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/37\/2023\/12\/svg-support-di-dashboard-wp.png\/w=341,fit=scale-down 341w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/37\/2023\/12\/svg-support-di-dashboard-wp.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/37\/2023\/12\/svg-support-di-dashboard-wp.png\/w=150,fit=scale-down 150w\" sizes=\"(max-width: 341px) 100vw, 341px\" \/><\/figure><\/div><ol class=\"wp-block-list\" start=\"3\">\n<li>Centang kotak di sebelah opsi <strong>Restrict to Administrator <\/strong>untuk membatasi hak upload. Lakukan hal yang sama pada opsi <strong>Enable Advanced Mode<\/strong> kalau Anda ingin mengakses fitur-fitur tingkat lanjut, seperti rendering SVG inline dan CSS styling.<\/li>\n<\/ol><div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img decoding=\"async\" width=\"768\" height=\"310\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/37\/2023\/12\/konfigurasi-svg-support.png\/public\" alt=\"konfigurasi svg support\" class=\"wp-image-32907\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/37\/2023\/12\/konfigurasi-svg-support.png\/w=768,fit=scale-down 768w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/37\/2023\/12\/konfigurasi-svg-support.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/37\/2023\/12\/konfigurasi-svg-support.png\/w=150,fit=scale-down 150w\" sizes=\"(max-width: 768px) 100vw, 768px\" \/><\/figure><\/div><ol class=\"wp-block-list\" start=\"4\">\n<li>Setelah menyimpan perubahan, Anda bisa mulai upload file SVG ke media library dengan aman.<\/li>\n<\/ol><p>\n\n\n<div class=\"protip\">\n                    <h4 class=\"title\">Tips Berguna<\/h4>\n                    <p>Opsi untuk merender featured image (gambar unggulan) secara inline akan muncul pada postingan WordPress yang menggunakan file SVG sebagai featured image kalau Anda mengaktifkan mode tingkat lanjut.<\/p>\n                <\/div>\n\n\n\n<\/p><h3 class=\"wp-block-heading\" id=\"h-menambahkan-dukungan-svg-wordpress-secara-manual\">Menambahkan Dukungan SVG WordPress secara Manual<\/h3><p>Dengan metode ini, Anda perlu mengedit file <strong>functions.php<\/strong> website WordPress. Sebaiknya hanya lakukan langkah-langkah ini kalau Anda sudah sering <a href=\"\/id\/tutorial\/belajar-wordpress\">belajar WordPress<\/a>, familiar dengan PHP, dan sepenuhnya memahami masalah keamanan SVG.<\/p><p>\n\n\n<div><p class=\"important\"><strong>Penting!<\/strong> Pastikan untuk <a href=\"\/id\/tutorial\/cara-backup-wordpress\">backup website WordPress<\/a> sebelum melakukan perubahan apa pun untuk menghindari kehilangan data kalau-kalau terjadi kesalahan konfigurasi.<\/p><\/div>\n\n\n\n<\/p><p>Langkah-langkah berikut akan menjelaskan cara mengaktifkan SVG di WordPress secara manual melalui <a href=\"\/id\/tutorial\/cara-menggunakan-file-manager-hostinger\">File Manager Hostinger<\/a>. Namun, Anda juga bisa menggunakan klien FTP seperti <a href=\"\/id\/tutorial\/cara-menggunakan-filezilla\">FileZilla<\/a> sebagai tool alternatif.<\/p><ol class=\"wp-block-list\">\n<li>Akses hPanel dan buka <strong>File<\/strong> -&gt; <strong>File Manager<\/strong>.<\/li>\n\n\n\n<li>Cari folder <strong>public_html<\/strong> -&gt; <strong>wp-includes<\/strong>. Scroll ke bawah sampai Anda menemukan <strong>functions.php<\/strong>.<\/li>\n<\/ol><div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large\"><img decoding=\"async\" width=\"1159\" height=\"414\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/37\/2022\/11\/functions-php-di-file-manager-hpanel-baru.png\/public\" alt=\"functions.php di file manager hostinger\" class=\"wp-image-27450\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/37\/2022\/11\/functions-php-di-file-manager-hpanel-baru.png\/w=1159,fit=scale-down 1159w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/37\/2022\/11\/functions-php-di-file-manager-hpanel-baru.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/37\/2022\/11\/functions-php-di-file-manager-hpanel-baru.png\/w=1024,fit=scale-down 1024w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/37\/2022\/11\/functions-php-di-file-manager-hpanel-baru.png\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/37\/2022\/11\/functions-php-di-file-manager-hpanel-baru.png\/w=768,fit=scale-down 768w\" sizes=\"(max-width: 1159px) 100vw, 1159px\" \/><\/figure><\/div><ol class=\"wp-block-list\" start=\"3\">\n<li>Klik ganda file untuk membukanya, lalu paste (tempel) potongan kode berikut ke dalam file:<\/li>\n<\/ol><pre class=\"wp-block-preformatted\">function add_file_types_to_uploads($file_types){\n$new_filetypes = array();\n$new_filetypes['svg'] = 'image\/svg+xml';\n$file_types = array_merge($file_types, $new_filetypes );\nreturn $file_types;\n}\nadd_filter('upload_mimes', 'add_file_types_to_uploads');<\/pre><ol class=\"wp-block-list\" start=\"4\">\n<li>Simpan perubahan dan coba upload file SVG. Apabila prosesnya berhasil, media library Anda kini bisa menerima upload file SVG.<\/li>\n<\/ol><div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><a href=\"\/id\/wordpress-hosting\" target=\"_blank\" rel=\"noreferrer noopener\"><img decoding=\"async\" width=\"1024\" height=\"300\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/37\/2024\/06\/ID-New-WP_in-text-banner.png\/public\" alt=\"\" class=\"wp-image-37614\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/37\/2024\/06\/ID-New-WP_in-text-banner.png\/w=1024,fit=scale-down 1024w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/37\/2024\/06\/ID-New-WP_in-text-banner.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/37\/2024\/06\/ID-New-WP_in-text-banner.png\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/37\/2024\/06\/ID-New-WP_in-text-banner.png\/w=768,fit=scale-down 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><\/figure><\/div><h2 class=\"wp-block-heading\" id=\"h-kesimpulan\">Kesimpulan<\/h2><p>File SVG memiliki berbagai keunggulan dan manfaat yang membuatnya cukup populer digunakan. Sayangnya, file teks XML rentan terhadap injeksi kode, yang merupakan alasan utama WordPress tidak menyertakan dukungan SVG secara default.<\/p><p>Meski begitu, ada dua cara agar file SVG bisa diupload ke WordPress: menggunakan plugin atau memodifikasi file <strong>functions.php<\/strong> website. Jangan lupa untuk membatasi hak upload agar Anda bisa mengunggah file SVG ke media library website dengan aman.<\/p><p>Semoga <a href=\"\/id\/tutorial\/wordpress\">tutorial WordPress<\/a> ini bisa membantu Anda memahami cara upload SVG ke WordPress beserta manfaat dan risikonya, ya. Semoga sukses selalu!<\/p><h2 class=\"wp-block-heading\" id=\"h-pertanyaan-umum-seputar-mengupload-svg-ke-wordpress\">Pertanyaan Umum seputar Mengupload SVG ke WordPress<\/h2><p>Berikut adalah jawaban atas beberapa pertanyaan umum mengenai file SVG di WordPress.<\/p><div id=\"rank-math-faq\" class=\"rank-math-block\">\n<div class=\"rank-math-list \">\n<div id=\"faq-question-69442c9ea9d91\" class=\"rank-math-list-item\">\n<h3 class=\"rank-math-question \">Apakah SVG Lebih Baik dari PNG untuk Website?<\/h3>\n<div class=\"rank-math-answer \">\n\n<p>Tergantung kebutuhan Anda. SVG akan lebih baik untuk gambar yang bisa diubah ukurannya sesuai kebutuhan, file berukuran kecil, dan grafik animasi, sedangkan PNG lebih baik untuk gambar dengan banyak detail dan transparansi.<\/p>\n\n<\/div>\n<\/div>\n<div id=\"faq-question-69442c9ea9d95\" class=\"rank-math-list-item\">\n<h3 class=\"rank-math-question \">Perlukah Menggunakan Logo SVG di Website WordPress?<\/h3>\n<div class=\"rank-math-answer \">\n\n<p>Ya, menggunakan logo SVG di website WordPress bisa meningkatkan skalabilitas, mengurangi ukuran file, memungkinkan penyesuaian, dan menjamin kompatibilitas dengan semua perangkat dan browser modern.<\/p>\n\n<\/div>\n<\/div>\n<div id=\"faq-question-69442c9ea9d96\" class=\"rank-math-list-item\">\n<h3 class=\"rank-math-question \">Kenapa Tidak Bisa Upload File SVG ke WordPress?<\/h3>\n<div class=\"rank-math-answer \">\n\n<p>WordPress mungkin tidak mengizinkan upload SVG karena alasan keamanan. File SVG bisa mengandung kode berbahaya yang bisa merusak website Anda. Solusinya, gunakan plugin atau ubah SVG menjadi PNG atau JPG sebelum menguploadnya.<\/p>\n\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>Apabila menangani pengelolaan dan desain web, Anda pasti sering menggunakan berbagai format file media. Nah, SVG adalah salah satu format terpopuler saat ini, yaitu file vektor berbasis XML. Sayangnya, tidak semua browser dan platform mendukung SVG sehingga Anda perlu mengaktifkan dukungannya dulu secara manual. Tenang, di artikel ini kami akan membahas cara upload file SVG [&#8230;]<\/p>\n<p><a class=\"btn btn-secondary understrap-read-more-link\" href=\"\/id\/tutorial\/cara-upload-svg-wordpress\">Read More&#8230;<\/a><\/p>\n","protected":false},"author":190,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"rank_math_title":"%title%","rank_math_description":"SVG adalah salah satu format file gambar terbaik untuk website, tapi bisa berbahaya. Baca cara upload SVG ke WordPress dengan aman yuk!","rank_math_focus_keyword":"cara upload svg ke wordpress, apa itu svg, file svg","footnotes":""},"categories":[4859],"tags":[9132,9131,9133,9135,9134,9137,9136,9138],"class_list":["post-10026","post","type-post","status-publish","format-standard","hentry","category-wordpress","tag-apa-itu-svg","tag-file-svg","tag-format-svg","tag-gambar-svg","tag-svg","tag-svg-wordpress","tag-upload-svg-ke-wordpress","tag-wordpress-svg"],"hreflangs":[{"locale":"en-US","link":"https:\/\/www.hostinger.com\/tutorials\/upload-svg-to-wordpress","default":0},{"locale":"fr-FR","link":"https:\/\/www.hostinger.com\/fr\/tutoriels\/televerser-fichier-svg-wordpress","default":0},{"locale":"es-ES","link":"https:\/\/www.hostinger.com\/es\/tutoriales\/cargar-en-wordpress-svg","default":0},{"locale":"id-ID","link":"https:\/\/www.hostinger.com\/id\/tutorial\/cara-upload-svg-wordpress","default":0},{"locale":"en-UK","link":"https:\/\/www.hostinger.com\/uk\/tutorials\/upload-svg-to-wordpress","default":0},{"locale":"en-MY","link":"https:\/\/www.hostinger.com\/my\/tutorials\/upload-svg-to-wordpress","default":0},{"locale":"en-PH","link":"https:\/\/www.hostinger.com\/ph\/tutorials\/upload-svg-to-wordpress","default":0},{"locale":"es-MX","link":"https:\/\/www.hostinger.com\/mx\/tutoriales\/entorno-staging-wordpress-8","default":0},{"locale":"es-CO","link":"https:\/\/www.hostinger.com\/co\/tutoriales\/como-usar-sftp-21","default":0},{"locale":"es-AR","link":"https:\/\/www.hostinger.com\/ar\/tutoriales\/entorno-staging-wordpress-8","default":0},{"locale":"en-IN","link":"https:\/\/www.hostinger.com\/in\/tutorials\/upload-svg-to-wordpress","default":0},{"locale":"en-CA","link":"https:\/\/www.hostinger.com\/ca\/tutorials\/upload-svg-to-wordpress","default":0},{"locale":"en-AU","link":"https:\/\/www.hostinger.com\/au\/tutorials\/upload-svg-to-wordpress","default":0},{"locale":"en-NG","link":"https:\/\/www.hostinger.com\/ng\/tutorials\/upload-svg-to-wordpress","default":0}],"_links":{"self":[{"href":"https:\/\/www.hostinger.com\/id\/tutorial\/wp-json\/wp\/v2\/posts\/10026","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.hostinger.com\/id\/tutorial\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.hostinger.com\/id\/tutorial\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.hostinger.com\/id\/tutorial\/wp-json\/wp\/v2\/users\/190"}],"replies":[{"embeddable":true,"href":"https:\/\/www.hostinger.com\/id\/tutorial\/wp-json\/wp\/v2\/comments?post=10026"}],"version-history":[{"count":7,"href":"https:\/\/www.hostinger.com\/id\/tutorial\/wp-json\/wp\/v2\/posts\/10026\/revisions"}],"predecessor-version":[{"id":47190,"href":"https:\/\/www.hostinger.com\/id\/tutorial\/wp-json\/wp\/v2\/posts\/10026\/revisions\/47190"}],"wp:attachment":[{"href":"https:\/\/www.hostinger.com\/id\/tutorial\/wp-json\/wp\/v2\/media?parent=10026"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.hostinger.com\/id\/tutorial\/wp-json\/wp\/v2\/categories?post=10026"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.hostinger.com\/id\/tutorial\/wp-json\/wp\/v2\/tags?post=10026"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}