Pop

Tema minimalis, yang direka untuk mengekalkan kandungan anda yang boleh diakses. Pop sangat ideal untuk kedai dengan inventori bersaiz kecil dan pertengahan, Pop direka di sekitar navigasi bar sisi besar yang menyimpan kandungan tersedia anda boleh diakses.

Contoh kedai dalam talian menggunakan Pop

Editor tema

Gunakan editor tema untuk menyesuaikan tema anda. Bar alat editor tema dibahagi ke dalam Tetapan Bahagian dan Tema.

Bar alat editor tema menunjukkan tetapan Bahagian dan Tema

Anda boleh menggunakan bahagian untuk mengubah suai kandungan dan susun atur halaman yang berlainan di kedai anda. Anda boleh menggunakan tetapan tema untuk menyesuaikan fon dan warna kedai anda, dan membuat perubahan pada pautan media sosial dan tetapan daftar keluar anda.

Bahagian adalah blok kandungan boleh disesuaikan yang menentukan susun atur bagi halaman yang berbeza pada kedai dalam talian anda.

  • Bahagian rumah termasuk ciri-ciri seperti tayangan slaid atau pendaftaran surat berita yang boleh anda tambahkan, susun semula, atau alih keluar. Anda boleh mempunyai sehingga 25 bahagian pada halaman rumah anda.

  • Setiap jenis halaman mempunyai bahagiannya sendiri. Sebagai contoh, bahagian halaman produk menentukan susun atur setiap halaman produk di kedai dalam talian anda.

  • Bahagian halaman sentiasa berada di tempat tertentu di kedai dalam talian anda. Anda boleh menyesuaikannya, tetapi anda tidak boleh mengatur semula atau mengalih alih keluar ia.

  • Setiap tema termasuk bahagian tetap, seperti pengepala dan pengaki, yang dipaparkan di setiap halaman kedai dalam talian anda.

Anda boleh belajar tentang pilihan bahagian unik dan cara menyesuaikan ia untuk sesuai dengan perniagaan anda.

Pop termasuk bahagian statik berikut:

  • Logo dan menu
  • Bar pengumuman
  • Pengaki
  • Halaman produk
  • Halaman koleksi
  • Halaman senarai koleksi
  • Artikel

Bahagian dinamik

Anda boleh menambahkan, menyusun semula dan mengalih keluar bahagian dinamik untuk menyesuaikan tata letak bagi halaman utama anda. Setiap tema mempunyai set bahagian dinamik yang unik untuk dipilih.

Pop termasuk bahagian dinamik yang berikut:

  • Catatan blog
  • Senarai koleksi
  • Koleksi yang ditampilkan
  • Imej dengan teks
  • Tayangan slaid
  • Produk yang ditampilkan
  • Surat berita
  • Peta
  • Teks kaya
  • Video
  • HTML Tersuai

Halaman produk

Di bahagian Halaman produk, anda boleh menambah atau mengalih keluar elemen berikut:

  • Jenama atau vendor produk
  • Zum imej
  • Produk berkaitan
  • Pemilih kuantiti
  • Butang daftar keluar dinamik
  • Ikon perkongsian sosial

Untuk mengedit tetapan untuk halaman produk:

  1. Daripada menu juntai bawah bar atas, pilih Halaman produk.

  2. Klik Bahagian.

  3. Klik Halaman produk.

  4. Untuk menunjukkan jenama atau vendor produk, semak Tunjukkan vendor produk. Untuk jenama atau vendor ditunjukkan, anda perlu menambah vendor kepada produk.

  5. Untuk membenarkan pelanggan zum masuk dengan melayangkan tetikus atas imej produk, semak Dayakan zum imej.

  6. Untuk menunjukkan pemilihan produk yang berkaitan di bahagian bawah halaman, semak Tunjukkan produk yang berkaitan. Koleksi produk yang dimiliki untuk menentukan produk berkaitan yang ditunjukkan. Untuk produk yang berkaitan ditunjukkan, anda perlu mencipta koleksi untuk produk tersebut atau tambahkannya pada koleksi yang sedia ada. Jika produk itu bukan sebahagian daripada koleksi, tiada produk yang berkaitan akan ditunjukkan.

  7. Untuk menunjukkan pemilih kuantiti, tandakan Tunjuk pemilih kuantiti.

  8. Untuk menunjukkan butang daftar keluar dinamik, semak Tunjuk butang daftar keluar dinamik.

  9. Untuk menunjukkan ikon perkongsian sosial, tandakan Dayakan perkongsian produk.

  10. Klik Simpan.

Surat berita

Anda boleh menambah pendaftaran surat berita ke halaman utama anda. Ini membenarkan anda untuk mengumpulkan alamat e-mel pelanggan untuk kempen pemasaran e-mel. Anda boleh mengetahui lebih lanjut tentang pemasaran e-mel di blog Shopify.

Bahagian surat berita di laman web. Terdapat medan untuk pelanggan memasukkan alamat e-mel dan butang yang mengatakan 'Langgan'.

Untuk menambah pendaftaran surat berita ke halaman utama anda:

  1. Cari Pop dan klik Sesuaikan.

  2. Klik Bahagian.

  3. Klik Tambah bahagian > Surat Berita.

  4. Masukkan tajuk untuk pendaftaran surat berita anda dalam medan Tajuk. Tajuk lalai adalah "Langgan surat berita kami".

  5. Masukkan subkepala untuk pendaftaran surat berita anda dalam medan Subteks. Teks lalai adalah "Promosi, produk baharu dan jualan. Terus ke peti masuk anda."

  6. Tetapkan warna latar belakang untuk bahagian pendaftaran surat berita dengan mengklik swatch Warna latar belakang dan memilih warna.

  7. Klik Simpan.

Video

Anda boleh menambah video yang dihoskan di YouTube atau Vimeo ke halaman utama anda. Video boleh melibatkan pelanggan dan menjana minat dalam perniagaan anda.

Untuk menambah video ke halaman utama anda:

  1. Cari Pop dan klik Sesuaikan.

  2. Klik Bahagian.

  3. Klik Tambah bahagian > Video.

  4. Masukkan pengepala untuk video anda dalam medan Pengepala.

  5. Masukkan pautan perkongsian untuk video anda dalam medan Pautan video.

    Pautan perkongsian YouTube kelihatan seperti ini: https://youtu.be/OTJXAUZY9t0. Anda boleh belajar cara menyalin pautan perkongsian untuk video YouTube dalam artikel Bantuan YouTube ini.

    Pautan perkongsian Vimeo kelihatan seperti ini: https://vimeo.com/281332510. Anda boleh belajar cara menyalin pautan perkongsian untuk video Vimeo dalam artikel Pusat Bantuan Vimeo ini.

  6. Klik Simpan.

HTML Tersuai

Dalam bahagian HTML Tersuai, anda boleh menggunakan kod HTML untuk membuat kandungan tersuai bagi halaman utama anda. Sebagai contoh, anda boleh menggunakan HTML untuk memformat blok teks, membuat jadual atau membenamkan kandungan daripada laman web pihak ketiga.

Untuk menambahkan HTML tersuai ke laman utama anda:

  1. Cari Pop dan klik Sesuaikan.

  2. Klik Bahagian.

  3. Klik Tambah bahagian.

  4. Dalam kawasan Tata letak lanjutan, klik HTML Tersuai > Tambah.

  5. Klik HTML Tersuai, dan masukkan kod HTML yang anda mahu tambahkan ke halaman utama anda.

  6. Klik Simpan.

Tetapan tema, Anda boleh menggunakan tetapan tema untuk menyesuaikan warna dan tipografi pada kedai dalam talian anda. Anda juga boleh menyediakan pautan ke akaun media sosial anda, mengedit tetapan troli anda dan menambah favicon.

Pop termasuk tetapan tema yang berikut:

  • Warna
  • Tipografi
  • Favicon
  • Halaman troli
  • Media sosial
  • Daftar keluar

Warna

Anda boleh memilih warna untuk bahagian kedai dalam talian anda yang berbeza.

Sesuaikan tetapan warna anda

  1. Di sebelah **, klik **Sesuaikan.

  2. Klik Tetapan tema.

  3. Klik Warna.

  4. Untuk setiap jenis kandungan, klik swatch warna untuk menggunakan pemilih warna:

    Pemilih warna dalam editor tema

- Kawasan Terbaharu dipilih menunjukkan warna yang telah anda pilih baru-baru ini untuk tema anda. - Kawasan yang Sedang digunakan menunjukkan warna yang anda sedang gunakan dalam bahagian lain tema anda.

Untuk menetapkan warna kepada lut sinar, klik Tiada.

  1. Klik Simpan.

Tipografi

Anda boleh menetapkan gaya dan saiz fon untuk teks di kedai dalam talian anda.

Sesuaikan tetapan tipografi anda

  1. Di sebelah **, klik **Sesuaikan.

  2. Klik Tetapan tema.

  3. Klik Tipografi.

  4. Untuk setiap teks, klik Ubah untuk menggunakan pemilih fon:

    Butang 'Ubah' pada pemilih fon

  5. Terokai fon dengan menggunakan medan carian, atau dengan mengklik Muatkan lagi.

    Untuk melihat semua fon yang tersedia, lihat Perpustakaan fon Shopify.

  6. Klik nama tulisan yang anda mahu gunakan.

  7. Untuk menukar fon ke gaya yang berbeza, seperti tebal atau condong, klik Biasa. Seterusnya, klik gaya yang anda ingin gunakan dan kemudian klik Pilih:

    Pilihan berat fon yang terdapat pada pemilih fon

  8. Klik Simpan.

Media sosial

Anda boleh menambah butang perkongsian sosial untuk produk dan catatan blog anda, dan pautan ke akaun media sosial anda.

Untuk menyesuaikan tetapan media sosial:

  1. Cari Pop dan klik Sesuaikan.

  2. Klik Tetapan tema.

  3. Klik Media sosial.

  4. Untuk memuat naik imej perkongsian sosial, dalam kawasan Imej perkongsian sosial, klik Pilih imej atau Terokai imej percuma.

  5. Untuk menambah pautan ke akaun media sosial anda, dalam kawasan Akaun sosial, masukkan pautan ke akaun anda dalam medan yang disediakan. Masukkan pautan penuh, seperti https://instagram.com/shopify atau https://twitter.com/shopify.

    Pautan ke akaun media sosial anda ditunjukkan di pengaki kedai dalam talian anda.

  6. Untuk menambah butang perkongsian sosial pada produk dan catatan blog anda, di kawasan Opsyen perkongsian sosial, tandakan mana-mana atau semua kotak semak.

    Anda boleh menambah butang perkongsian berikut:

- Kongsi di Facebook - Tweet di Twitter - Pin pada Pinterest (tidak tersedia untuk perkongsian catatan blog)

  1. Klik Simpan.

Tambahkan sub-menu ke bar sisi

Untuk menambah menu tarik turun ke Menu Utama anda, anda perlu mencipta menu pada halaman Navigasi anda. Artikel ini akan membimbing anda melalui proses itu.

Saiz logo kedai yang optimum

Logo kompak yang mengikut kadar akan kelihatan terbaik dalam tema Pop kerana ia memaparkan logo anda dalam bar sisi. Logo seakan sepanduk, dengan lebar yang besar dan ketinggian yang agak kecil tidak kelihatan baik dalam tema itu.

Lebar maksimum untuk logo anda ialah 450 piksel, dan ketinggian maksimum ialah 200 piksel. Fail logo yang dimuat naik akan diubah suai untuk muat dalam kekangan tersebut.

Format yang ideal ialah PNG.

Jadikan logo anda lebih besar pada peranti mudah alih

Yang pertama, untuk menjadikan logo anda lebih besar dalam tata letak, sangat penting untuk memangkas semua ruang negatif atau piksel telus yang mengelilingi grafik logo anda sebelum anda memuat naik failnya ke Shopify.

Berikut adalah logo yang mempunyai banyak ruang negatif di sekelilingnya:

Berikut adalah logo yang sama apabila dipangkas — apabila semua ruang negatif telah dipangkas daripadanya:

Logo yang tidak dipangkas ditunjukkan di bawah apabila digunakan dalam tema Pop:

Logo dipangkas ditunjukkan di bawah apabila digunakan dalam tema Pop:

Sebaik sahaja anda tahu bahawa logo anda tidak dibuat lebih kecil kerana ruang negatif yang dikandunginya, anda boleh melaraskan ketinggian pengepala mudah alih anda untuk memberi ruang kepada logo anda untuk berkembang. Akibatnya, logo anda akan menjadi lebih besar.

Teruskan ke editor tema dan, dalam bahagian Pengepala & Navigasi, tingkatkan nilai "Saiz> Menu Tinggi Mudah Alih".

Jadikan logo anda lebih besar di bar sisi

Yang pertama, untuk menjadikan logo anda lebih besar dalam tata letak, sangat penting untuk memangkas semua ruang negatif atau piksel telus yang mengelilingi grafik logo anda sebelum anda memuat naik failnya ke Shopify.

Berikut adalah logo yang mempunyai banyak ruang negatif di sekelilingnya:

Berikut adalah logo yang sama apabila dipangkas — apabila semua ruang negatif telah dipangkas daripadanya:

Logo dengan ruang negatif ditunjukkan di bawah apabila dimuat naik ke tema Pop:

Logo dipangkas ditunjukkan di bawah apabila digunakan dalam tema Pop:

Sebaik sahaja anda tahu bahawa logo anda tidak dibuat lebih kecil kerana ruang negatif yang dikandunginya, anda boleh melaraskan lebar bas sisi anda untuk memberi ruang kepada logo anda untuk berkembang. Akibatnya, logo anda akan menjadi lebih besar.

Teruskan ke editor tema dan, dalam bahagian Pengepala & Navigasi, tingkatkan nilai "Saiz > Lebar Menu Desktop".

Kurangkan ruang kosong di sekitar logo bar sisi

Sebelum anda mengalih keluar sebarang salutan yang ditambah oleh tema Pop di atas dan di bawah logo anda, adalah sangat penting untuk memangkas sebarang salutan yang mungkin berasal daripada imej itu sendiri. Anda perlu mengurangkan ruang negatif atau piksel telus yang mengelilingi grafik logo anda sebelum anda memuat naik failnya ke Shopify.

Berikut adalah logo yang mempunyai banyak ruang negatif di sekelilingnya:

Di sini adalah logo yang sama apabila dipangkas — ruang negatif telah dipangkas daripadanya:

Logo yang tidak dipangkas ditunjukkan di bawah apabila digunakan dalam tema Pop:

Logo dipangkas ditunjukkan di bawah apabila digunakan dalam tema Pop:

Sebaik sahaja anda memuat naik logo yang dipangkas pada aset tema anda, anda boleh melaraskan lebar bar sisi anda dengan pergi ke editor tema. Di bahagian Pengepala & Navigasi, edit nilai "Saiz> Lebar Menu Desktop" mengikut kesesuaian anda.

Akhir sekali, langkah yang tidak disokong, jika anda ingin mengurangkan penebal di atas dan di bawah logo anda, ikut langkah berikut:

  1. Di bawah Aset, klik timber.scss.liquid untuk membuka lembaran gaya tema anda dalam editor kod dalam talian atau pergi ke URL ini.

  2. Di bahagian bawah fail, tambah ini:

```sass {% comment %} Fungsi pertanyaan media berikut menghasilkan ini: @skrin media dan (lebar min: 1025px) { ... } Bar sisi hanya ditunjukkan apabila lebar > 1025 pixels. {% endcomment %}

@include at-query ($min, $large) { .header-logo { margin-bottom: 30px /* original is 60px */; }

.site-header {
   padding-top: 30px /* original is 90px */;

   .hr--small {
     margin: 0 auto 10px /* original is 15px auto 30px */;
   }
 }

} ```

  1. Simpan fail anda.

Edit tetapan untuk halaman produk

Di bahagian Halaman produk, anda boleh menambah atau mengalih keluar elemen berikut:

  • Jenama atau vendor produk
  • Zum imej
  • Produk berkaitan
  • Pemilih kuantiti
  • Butang daftar keluar dinamik
  • Ikon perkongsian sosial

Untuk mengedit tetapan untuk halaman produk:

  1. Daripada menu juntai bawah bar atas, pilih Halaman produk.

  2. Klik Bahagian.

  3. Klik Halaman produk.

  4. Untuk menunjukkan jenama atau vendor produk, semak Tunjukkan vendor produk. Untuk jenama atau vendor ditunjukkan, anda perlu menambah vendor kepada produk.

  5. Untuk membenarkan pelanggan zum masuk dengan melayangkan tetikus atas imej produk, semak Dayakan zum imej.

  6. Untuk menunjukkan pilihan produk berkaitan di bahagian bawah halaman, tandakan Tunjukkan produk berkaitan. Koleksi tempat produk itu dikelompokkan akan menentukan produk berkaitan yang akan ditunjukkan. Untuk memastikan produk berkaitan ditunjukkan, anda perlu mencipta koleksi untuk produk tersebut, atau menambahkan ia pada koleksi sedia ada. Jika produk itu bukan sebahagian daripada koleksi, tiada produk berkaitan akan ditunjukkan.

  7. Untuk menunjukkan pemilih kuantiti, tandakan Tunjuk pemilih kuantiti.

  8. Untuk menunjukkan butang daftar keluar dinamik, semak Tunjuk butang daftar keluar dinamik.

  9. Untuk menunjukkan ikon perkongsian sosial, tandakan Dayakan perkongsian produk.

  10. Klik Simpan.

Jenis imej produk terbaik untuk Pop

Resolusi foto yang lebih tinggi akan kelihatan lebih berkilat dan profesional dalam tema Pop, dan oleh itu anda harus menyasarkan imej yang sekurang-kurangnya 1024 piksel lebar kali 1024 piksel tinggi. Imej akan diturunkan skala secara automatik jika perlu, jadi semakin berkualiti tinggi adalah lebih baik.

Foto resolusi yang lebih tinggi akan menjadi penting jika anda menggunakan fungsi Zum Imej, yang boleh anda dayakan dalam editor tema di bahagian Halaman Produk:

Sebaik-baiknya, imej produk yang ditampilkan anda semuanya akan berkongsi nisbah lebar dan ketinggian yang sama untuk kelihatan yang terbaik di halaman koleksi.

Sedia untuk mula menjual dengan Shopify?

Cuba secara percuma