Cara Menambah a Shopify Favicon kepada Anda Shopify Kedai

Ketahui asas apa itu Shopify Favicon dan cara meletakkannya di kedai dalam talian anda.

Jika anda melanggan perkhidmatan daripada pautan di halaman ini, Reeves and Sons Limited mungkin mendapat komisen. Lihat kami pernyataan etika.

Identiti kedai e-dagang anda menghimpunkan beberapa elemen seperti logo, warna laman web, dan elemen anda bahan-bahan pemasaran. Identiti ini mengukuhkan jenama anda secara keseluruhan dan mencipta peringatan yang sihat untuk pelanggan anda, membangkitkan perasaan selesa dan kebolehpercayaan apabila mereka melihat imej dan warna jenama anda.

Walaupun bersaiz kecil, Favicon juga terikat dengan strategi penjenamaan itu. Dalam tutorial ini, kami akan menunjukkan kepada anda cara membuat dan menambah favicon pada anda Shopify menyimpan, melengkapkan penampilan dalam talian anda dan mempermudah mengenali kedai anda semasa pelanggan berkunjung.

Apa itu Shopify Favicon?

A Shopify Favicon, atau Favicon apa pun, adalah ikon kecil untuk laman web anda yang muncul di tab penyemak imbas di sebelah nama laman web anda.

Bar alamat penyemak imbas adalah kawasan yang paling biasa untuk melihat laman web Favicon, tetapi juga terdapat di lokasi berikut:

  • Aplikasi bar alat
  • Penanda buku
  • Hasil sejarah
  • Cari bar
  • Kadang kala apabila dikongsi di media sosial

Pada asasnya, apabila penyemak imbas perlu menunjukkan pautan ke tapak web anda, dan tiada banyak ruang untuk kandungan lain, ia menggantikan logo biasa bersaiz penuh anda dengan Favicon.

Shopify Contoh favicon

Secara lalai, Shopify menambah Shopify logo untuk Favicon anda, jadi kami perlu mengubahnya.

Favicon yang bagus selalunya merupakan versi logo anda yang lebih kecil, tetapi kadang kala ia sedikit berbeza kerana anda ingin memastikannya kelihatan, mengambil semua ruang yang diperuntukkan, dan menambahkan sedikit warna di sebelah nama laman web anda.

Secara lalai, semua pelayar menyokong Favicons bersaiz 32ร—32 piksel. Itu imej yang agak kecil, tetapi dengan bantuan beberapa penjana dalam talian anda boleh membuatnya sendiri Shopify Favicon untuk tapak web anda. Selain itu, imej yang lebih besar akan dikecilkan, jadi anda tidak semestinya perlu menjadikannya tepat 32ร—32.

Favicon cukup masuk akal untuk kedai dalam talian Shopify memandangkan ia mudah ditambah, dan adalah penting untuk mengukuhkan identiti jenama anda sebagai penjual dalam talian. Ada juga yang berpendapat bahawa ia membantu dengan SEO.

Teruskan membaca untuk mengetahui lebih lanjut mengenai cara menambahkan Favicon pada anda Shopify kedai.

Cara Menambah Favicon pada Anda Shopify Kedai โ€“ Panduan Langkah Pantas

Seperti yang disebutkan, semasa menjalankan laman web melalui Shopify secara automatik menambah a Shopify logo sebagai Favicon tapak anda. Tidak ada yang salah dengan itu, tetapi lebih profesional dan berorientasikan jenama untuk memasukkan logo anda sendiri. Berikut adalah langkah-langkah yang perlu anda ikuti:

Langkah 1: Pergi ke Anda Shopify Papan Pemuka

Oleh itu, pergi ke anda Shopify papan pemuka dan klik pada Kedai Dalam Talian di bawah Saluran Jualan.

Langkah 2: Navigasi ke Tetapan Tema

Navigasi ke Tema anda dan klik pada butang Sesuaikan di sebelah tema semasa anda. Walaupun tetapan berubah dari tema ke tema, semuanya paling baru Shopify tema mempunyai bahagian untuk menukar Favicon.

kedai online

Dalam Shopify penyesuai, tatal ke bahagian bawah senarai di sebelah kiri dan klik pada Tetapan Tema.

tetapan tema

Langkah 3: Pilih Butang Favicon

Di bahagian baru, cari dan pilih butang Favicon.

favicon Shopify Favicon

Ini mendedahkan butang untuk Pilih Imej atau Teroka Imej Percuma. Saya tidak dapat bayangkan mereka mempunyai sebarang imej percuma yang sepadan dengan logo anda, jadi sebaiknya klik pada Pilih Imej untuk memuat naik imej tersuai dari komputer anda.

pilih gambar

Langkah 4: Muat Naik Favicon Anda

Pilih fail Favicon dan muat naik ke Shopify.

Selepas itu, anda akan melihat pratonton ikon Favicon anda. Untuk membuat perubahan kekal, pilih butang Simpan dalam Shopify.

butang simpan

Untuk melihat anda Shopify favicon dalam tindakan, pergi ke bahagian depan laman web anda dan lihat tab penyemak imbas semasa. Anda mesti melihat Favicon di sebelah tajuk laman web anda.

contoh Shopify Favicon

Petua Membuat Favicon Anda

Walaupun nampaknya mudah untuk menjana ikon kecil, adalah penting untuk membetulkannya, memandangkan pelanggan melihat Favicon apabila mereka datang ke tapak anda. Ia juga mudah untuk membuat Favicon yang kabur atau tidak memenuhi seluruh ruang, mengalahkan tujuan Favicon kerana ia tidak begitu kelihatan dengan mata.

Untuk menyelesaikan sebarang masalah, berikut adalah beberapa petua untuk membuat anda Shopify Favicon:

  • Mulakan reka bentuk anda lebih besar daripada 32ร—32 dan kecilkan jika perlu. Anda pasti mempunyai imej yang lebih kabur jika anda cuba meregangkan imej yang lebih kecil ke dalam ruang. Sebagai contoh, mengambil imej 32ร—32 daripada Hatchful dan cuba meregangkannya untuk menyingkirkan bahagian bertulis logo boleh menyebabkan masalah.
  • Anda biasanya tidak boleh mengambil logo semasa anda dan mengharapkan ia berfungsi dengan sempurna sebagai Favicon.
  • Favicon kelihatan hebat apabila anda menutup setiap piksel ruang yang disediakan. Anda tidak mempunyai banyak ruang, jadi anda harus memanfaatkan setiap ruang square piksel dalam ruang 32 ร— 32.
  • Alih keluar semua teks, kerana sukar untuk dibaca dalam Favicon. Pengecualian adalah jika elemen logo utama anda ialah huruf besar.
  • Tangkap untuk warna pepejal dan lebih terang. Logo kartun yang ringkas berfungsi dengan baik.
  • Lihatlah Favicons dari jenama kegemaran anda. Apa yang telah mereka lakukan untuk memastikan imej dalam talian mereka melalui favicon?
  • Pertimbangkan sama ada mengisi seluruh ruang dengan latar belakang warna pepejal atau membuat latar belakang lutsinar dengan elemen latar depan diregangkan supaya ia hanya menyentuh tepi. Anda akan dapati bahawa banyak jenama yang lebih besar mempunyai latar belakang telus untuk Favicon mereka.
  • Fail ICO format berfungsi dengan baik untuk imej yang lebih kecil. Jika anda tidak biasa, gunakan PNG untuk latar belakang lutsinar atau JPG untuk Favicon resolusi tinggi dengan latar belakang pepejal.

Bagaimana Menjana Favicon untuk Anda Shopify Kedai

Anda mempunyai pilihan untuk mereka bentuk Favicon dalam mana-mana perisian reka bentuk pilihan anda. Jika anda lebih suka Photoshop, gunakan itu. Jika anda lebih suka perisian percuma seperti GIMP atau Pixlr, kesemuanya berfungsi selagi anda berpegang pada dimensi 32ร—32 yang diperlukan.

Anda juga mempunyai pilihan untuk membuat Favicon dengan ShopifyLogo Hatchful dan Penjana Favicon Percuma. Lihat keseluruhan panduan kami Semasa menggunakan Hebat untuk membina logo.

muat turun logo

Sebaik sahaja pencipta logo melakukan kerjanya, ia memberikan anda fail yang diisi dengan berbilang logo formats, salah satunya ialah Favicon.

Shopify Fail faavicon

Perlu diingat bahawa banyak logo yang anda buat Hebat (baca kami Ulasan yang menarik) gunakan ruang putih di sekeliling logo, jadi anda mungkin perlu melaraskannya supaya grafik meliputi sebahagian besar ruang. Secara umum, saya mendapati bahawa anda hanya perlu menggunakan favicon Hatchful yang disediakan jika ia sudah kelihatan baik (ia memenuhi kebanyakan ruang dan tidak mempunyai elemen kecil seperti teks).

Jika itu tidak berlaku, gunakan perisian penyuntingan pihak ketiga seperti Photoshop atau Pixlr untuk memotong beberapa elemen yang tidak diperlukan.

penting: Anda perlu menggunakan versi imej yang lebih besar jika anda merancang untuk meregangkannya di atas kanvas untuk memotong teks dan ruang putih. Untuk ini, saya menggunakan Hatchful untuk menjana logo tetapi sebenarnya mengambil salah satu logo besar (bukan fail Favicon yang disediakan) kerana saya tidak mahu kekaburan berlaku apabila saya meregangkannya di atas kanvas 32ร—32.

Di dalam perisian penyuntingan anda, pilih kanvas baru dengan Lebar dan Tinggi masing-masing ditetapkan pada 32.

32 oleh 32

Buat lapisan untuk gambar baru dan pastikan gambar lebih besar daripada kanvas 32 ร— 32, kerana anda mungkin meregangkannya. Kemudian muat naik atau letakkan gambar ke dalam kanvas.

Pada tangkapan skrin berikut, saya mempunyai reka bentuk Favicon yang diperbesar sehingga saya dapat memastikannya sesuai square dengan betul. Ia kabur, tetapi saya tahu ia akan kelihatan lebih baik apabila saya zum keluar.

versi besar

Seperti yang anda lihat, versi Favicon yang dizum keluar dalam pereka Pixlr kelihatan bagus. Saya telah merangkumi sebahagian besar ruang yang diperuntukkan, memilih ikon warna terang dan pepejal dan mengalih keluar semua tanda teks yang lebih kecil.

versi lebih kecil

Langkah terakhir ialah memuat turun fail. Anda boleh memilih untuk menjadikannya PNG lutsinar pada ketika ini. Tetapi untuk tutorial ini saya tetap menggunakan JPG resolusi tinggi supaya ia kelihatan setajam mungkin. Dan saya tidak kisah mempunyai latar belakang dengan warna pepejal.

muat turun - Shopify Favicon

Kembali kepada anda Shopify papan pemuka. Klik di Kedai Dalam Talian> Tema> Sesuaikan.

Kemudian pergi ke Tetapan Tema> Favicon.

Muat naik Favicon baru itu dan klik butang Simpan di Shopify editor.

pratonton gambar

Sekali lagi, cara utama untuk menguji dan melihat Favicon anda adalah dengan hanya membuka tab dengan URL tapak web halaman utama anda. Seperti yang anda lihat, Favicon muncul dengan baik dan sebenarnya lebih baik sedikit daripada Favicon saya sebelum ini, memandangkan ia tidak mengisi keseluruhan ruang 32ร—32 yang disediakan.

produk akhir - Shopify Favicon

Dalam Kesimpulan

A Shopify Favicon mengambil masa tidak lebih daripada beberapa minit untuk mereka bentuk dan menambah pada tapak anda, namun ia memberikan peringatan yang menarik kepada pelawat anda di tapak web yang mereka gunakan. Selain itu, ia boleh berfungsi sebagai cara untuk orang mencari tapak web anda dalam penanda halaman dan sejarah penyemak imbas mereka, memandangkan mereka berkemungkinan besar mencari melalui senarai panjang tapak lain apabila melalui bahagian tersebut.

Perlu diingat bahawa anda tidak sepatutnya berpuas hati dengan kabur atau tidak boleh dibaca Shopify Imej favicon. Jika anda mendapati bahawa Favicon pertama kelihatan tidak betul, atau anda ingin memotong beberapa teks atau menambah latar belakang lutsinar, kembali ke permulaan dan perbetulkannya. Walaupun bukan idea yang baik untuk tidak mempunyai Favicon sama sekali, Favicon yang kabur atau sukar dilihat menjadikan jenama anda kelihatan tidak profesional dan agak bodoh.

Sekiranya anda mempunyai soalan mengenai menambah Favicons ke Shopify, atau membuat sendiri Shopify Favicon, beritahu kami di bahagian komen di bawah.

Joe Warnimont

Joe Warnimont adalah seorang penulis yang berpusat di Chicago yang memfokuskan pada alat eCommerce, WordPress, dan media sosial. Ketika tidak memancing atau berlatih yoga, dia mengumpulkan setem di taman negara (walaupun itu terutama untuk kanak-kanak). Lihat portfolio Joe untuk menghubunginya dan melihat karya lalu.

Komen-komen Responses 0

Sila tinggalkan balasan anda

Alamat email anda tidak akan disiarkan. Ruangan yang diperlukan ditanda *

Kedudukan *

Laman web ini menggunakan Akismet untuk mengurangkan spam. Ketahui bagaimana data komen anda diproses.