როგორ მოვამზადოთ WordPress Theme WooCommerce მზად

გახადეთ თქვენი WordPress Theme WooCommerce თავსებადი თემების სასარგებლო ნაწილებით

ასე რომ, გსურთ დაამატოთ მაღაზია თქვენს თემასთან დაკავშირებით – გასაოცარია! WooCommerce შესანიშნავი არჩევანია. ტექნიკურად რომ ვთქვათ სულ თემები “WooCommerce თავსებადია”, რადგან ეს არის მოდული. თეორიულად, ნებისმიერი დანამატი უნდა იმუშაოს WordPress- ის ნებისმიერ თემასთან (ეს არის სწორად კოდირებული).


როგორც თემის შემქმნელი, თქვენ შეიძლება მოგინდეთ WooCommerce– ის გამომავალი პროდუქტი, რომ უკეთესად მოერგოს თქვენს თემას ან თქვენს საბოლოო მომხმარებლებს მიაწოდოთ პარამეტრები, რომლებიც არ არის ხელმისაწვდომი WooCommerce– ის პარამეტრებში (მაგალითად, მაღაზიაში სვეტების რაოდენობის შეცვლა). ქვემოთ მოცემულია რამდენიმე სასარგებლო ფორმა, რომელთა გამოყენება შეგიძლიათ WooCommerce- სთვის უკეთეს მხარდაჭერაში თქვენს თემასთან დაკავშირებით ან / და თქვენი კონკრეტული დიზაინის ნივთების შესაცვლელად..

Მნიშვნელოვანი: ქვემოთ მოყვანილი ნახაზებიდან ბევრი იყენებს ფუნქციებს მხოლოდ WooCommerce- ში. ასე რომ, დარწმუნდით, რომ ეს ნაწყვეტები უბრალოდ არ არის ჩამოყრილი თქვენი ფუნქციების ბოლოში.php ფაილი განაწილებისთვის შექმნილი თემით. თუ აპირებთ თქვენს თემას სხვების გაზიარებას ან გაყიდვას, დარწმუნდით, რომ მოათავსეთ ნახაზები საკუთარ ფაილში დატვირთული მხოლოდ WooCommerce მოდულის აქტივის შემთხვევაში.

Contents

შეამოწმეთ ჩართულია WooCommerce

ჩემს თემებში მსურს განსაზღვროს ჩვეულებრივი კონსტანტა, რომლის გამოყენებაც შესაძლებელია იმის შესამოწმებლად, თუ ჩართულია WooCommerce ამ გზით, შემიძლია ფაილების ჩასმა ან ფუნქციების შესრულება მხოლოდ WooCommerce აქტიური გამოყენების დროს (იხილეთ მნიშვნელოვანი გზავნილი ზემოთ, თუ თქვენ ჯერ არ გაქვთ).

// დაამატეთ ახალი მუდმივი, რომელიც მართალია, თუ WooCommerce აქტიურია
განსაზღვრეთ ('WPEX_WOOCOMMERCE_ACTIVE', class_exists ('WooCommerce'));

// WooCommerce აქტიურია თუ არა
თუ (WPEX_WOOCOMMERCE_ACTIVE) {
// Გააკეთე რამე...
// ისეთი, როგორიცაა ახალი ფაილის ჩათვლით ყველა Woo რედაქტირება.
}

WooCommerce მხარდაჭერის შესახებ განაცხადეთ

ეს არის პირველი და ყველაზე მნიშვნელოვანი კოდი, რომელიც დაამატეთ თქვენს თემას, რომელიც WooCommerce- ს მხარდაჭერას „საშუალებას აძლევს“ და ხელს უშლის გაფრთხილებების დანამატს მოდელისგან, რომ საბოლოო მომხმარებელს ეუბნებიან, რომ თემა არ არის თავსებადი.

add_action ('after_setup_theme', ფუნქცია ()
add_theme_support ('woocommerce');
});

წაშალეთ WooCommerce CSS

პირადად მე უფრო მე ვაპირებ WooCommerce სტილის სტილს, რომ თავიდან ავიცილოთ რაიმე შესაძლო პრობლემები მე -3 მხარის WooCommerce მოდულით. თუმცა, თუ გსურთ WooCommerce– ის ყველა სტილის ამოღება, ეს ძალიან მარტივია.

შემდეგი ნაწყვეტი არის WooCommerce- ის ყველა სტილის მოსაშორებლად:

// წაშალეთ ყველა Woo სტილი
add_filter ('woocommerce_enqueue_styles', '__return_empty_array');

ეს ნაწყვეტი არის CSS- ის სპეციფიკური სტილის პირობითი მოხსნის მაგალითი:

ფუნქცია wpex_remove_woo_styles ($ სტილი) {
unset ($ სტილის ['woocommerce-general']);
unset ($ სტილის ['woocommerce- განლაგება']);
unset ($ სტილის ['woocommerce-smallscreen']);
$ სტილის დაბრუნება;
}
add_filter ('woocommerce_enqueue_styles', 'wpex_remove_woo_styles');

ჩართეთ WooCommerce პროდუქტის გალერეა, მასშტაბირება და განათება (v3.0 +)

WooCommerce 3.0-ში მათ გააცნეს ახალი პროდუქტის გალერეა, მასშტაბირება და შუქურა. ეს ყველაფერი უნდა ჩართოთ “add_theme_support” საშუალებით, თუ გსურთ გამოიყენოთ ისინი თქვენს თემაში.

add_theme_support ('wc-product-gallery-slider');
add_theme_support ('wc-product-gallery-zoom');
add_theme_support ('wc-product-gallery-lightbox');

წაშალეთ მაღაზიის სათაური

უამრავ თემას უკვე აქვს ფუნქციები საარქივო სათაურების ჩვენების მიზნით, ასე რომ, ეს კოდი შლის დამატებით სათაურს WooCommerce– სგან, რაც უკეთესია, ვიდრე იგი მალავს CSS– ს საშუალებით.

add_filter ('woocommerce_show_page_title', '__return_false');

შეცვალეთ საარქივო სათაური მაღაზიისთვის

თუ თქვენი თემა იყენებს archive_title () ან get_archive_title () ფუნქციებს თქვენი საარქივო სახელწოდების ასახვისთვის, შეგიძლიათ მარტივად გააგრიალოთ იგი ფილტრის საშუალებით, თქვენი წიგნის არქივის სახელწოდების ნაცვლად აითვისეთ თქვენი პროდუქტის გვერდის სახელი..

ფუნქცია wpex_woo_archive_title ($ სათაური) {
if (is_shop () && $ shop_id = wc_get_page_id ('მაღაზია')) {
$ title = get_the_title ($ shop_id);
}
$ სათაურის დაბრუნება;
}
add_filter ('get_the_archive_title', 'wpex_woo_archive_title');

შეცვალეთ მაღაზიაში თითო გვერდზე ნაჩვენები პროდუქტების რაოდენობა

გამოიყენება შეცვალოს რამდენ პროდუქტს აჩვენებს თითო გვერდი მაღაზიასა და პროდუქტის არქივში (კატეგორიები და წარწერები).

// Alter WooCommerce მაღაზიის შეტყობინებები გვერდზე
ფუნქცია wpex_woo_posts_per_page ($ cols) {
დაბრუნება 12;
}
add_filter ('loop_shop_per_page', 'wpex_woo_posts_per_page');

შეცვალეთ მაღაზიაში ნაჩვენები სვეტების რაოდენობა მწკრივზე

არ მესმის, რატომ მუშაობს WooCommerce ამ გზით, მაგრამ თქვენ უბრალოდ არ შეგიძლიათ შეცვალოთ ‘loop_shop_columns’ ფილტრი, თქვენ ასევე უნდა დაამატოთ უნიკალური კლასები სხეულის ეტიკეტზე, რათა სვეტები მუშაობდნენ. მიუხედავად იმისა, რომ Woo კატალოგებს აქვთ სწორი გაკვეთილების ტიპები, მაღაზიების გვერდები ასე არ არის, ამიტომ გვჭირდება ორი ფუნქცია.

// ალტერ მაღაზიის სვეტები
ფუნქცია wpex_woo_shop_columns ($ სვეტი) {
დაბრუნება 4;
}
add_filter ('loop_shop_columns', 'wpex_woo_shop_columns');

// დაამატეთ სწორი კლასის კლასი მაღაზიის სვეტებისთვის
ფუნქცია wpex_woo_shop_columns_body_class ($ კლასები) {
if (is_shop () || is_product_catalog () || is_product_tag ()) {
$ კლასები [] = 'სვეტები -4';
}
დააბრუნე $ კლასები;
}
add_filter ('body_class', 'wpex_woo_shop_columns_body_class');

შეცვალეთ შემდეგი და წინა პაგინაციის ისრები

ეს ნეკნი საშუალებას მოგცემთ გაითვალისწინოთ მაღაზიაში არსებული პაგინაციის ისრები, რომ შეესაბამებოდეს თქვენს თემას.

ფუნქცია wpex_woo_pagination_args ($ არგუმენტი) {
$ args ['prev_text'] = '';
$ args ['next_text'] = '';
დაბრუნება $ არგუმენტები;
}
add_filter ('woocommerce_pagination_args', 'wpex_woo_pagination_args');

შეცვალეთ OnSale სამკერდე ტექსტი

განსაკუთრებით სასარგებლოა საიტებზე, რომლებიც იყენებენ სხვა ენას ან ამოიღებენ ძახილის ნიშანს, რომელიც მე არ ვარ დიდი გულშემატკივარი.

ფუნქცია wpex_woo_sale_flash ()
დაბრუნების '”. esc_html __ ('გაყიდვა', 'ვოკომრეკა'). '';
}
add_filter ('woocommerce_sale_flash', 'wpex_woo_sale_flash');

შეცვალეთ პროდუქციის გალერეის მინიატურების სვეტები

თქვენ შეიძლება გსურთ შეცვალოთ სვეტების რაოდენობა ერთი პროდუქტის გალერეის მინიატურებისთვის, თქვენი განლაგებიდან გამომდინარე და ეს ფუნქცია ზუსტად ასე შესრულდება.

ფუნქცია wpex_woo_product_thumbnails_columns ()
დაბრუნება 4;
}
add_action ('woocommerce_product_thumbnails_columns', 'wpex_woo_product_thumbnails_columns');

შეცვალეთ ნაჩვენები დაკავშირებული პროდუქტების რაოდენობა

გამოიყენება პროდუქციის ერთი პროდუქტის გვერდზე გამოსახული პროდუქციის რაოდენობის შესაცვლელად.

// დააყენეთ დაკავშირებული პროდუქტები 4 პროდუქტის ჩვენების მიზნით
ფუნქცია wpex_woo_related_posts_per_page ($ არგუმენტები) {
$ args ['posts_per_page'] = 4;
დაბრუნება $ არგუმენტები;
}
add_filter ('woocommerce_output_related_products_args', 'wpex_woo_related_posts_per_page');

შეცვალეთ მწკრივთა სვეტების რაოდენობა შესაბამის და განახლებულ სექციებზე პროდუქტებზე

ისევე, როგორც მაღაზია, თუ გსურთ სწორად შეცვალოთ სვეტების რაოდენობა მონათესავე და რეალიზაციულ პროდუქტებზე ერთ პროდუქტის გვერდებზე, თქვენ უნდა დააფინოთ სვეტები და ასევე შეცვალოთ სხეულის კლასები შესაბამისად..

// ფილტრის გასაყიდი სვეტები
ფუნქცია wpex_woo_single_loops_columns ($ სვეტი) {
დაბრუნება 4;
}
add_filter ('woocommerce_up_sells_columns', 'wpex_woo_single_loops_columns');

// ფილტართან დაკავშირებული არგუმენტები
ფუნქცია wpex_woo_related_columns ($ არგუმენტი) {
$ args ['სვეტები'] = 4;
დაბრუნება $ არგუმენტები;
}
add_filter ('woocommerce_output_related_products_args', 'wpex_woo_related_columns', 10);

// ფილტრის სხეულის კლასები სვეტის კლასის დასამატებლად
ფუნქცია wpex_woo_single_loops_columns_body_class ($ კლასები) {
if (is_singular ('პროდუქტი')) {
$ კლასები [] = 'სვეტები -4';
}
დააბრუნე $ კლასები;
}
add_filter ('body_class', 'wpex_woo_single_loops_columns_body_class');

თქვენს მენიუში დაამატეთ დინამიური კალათის ბმული და კალათის ღირებულება

ეს ნეკნი დაამატებს WooCommerce კალათის ნივთს თქვენს მენიუში, რომელიც აჩვენებს თქვენი კალათის ნივთების ღირებულებას. გარდა ამისა, თუ თქვენს საიტს აქვს Font-Awesome ჩართული, ის აჩვენებს პატარა სავაჭრო ჩანთის ხატს. Მნიშვნელოვანი: ეს ფუნქციები არ უნდა იყოს შეყვანილი is_admin () პირობითად, რადგან ისინი ეყრდნობიან AJAX- ს, რომ განაახლონ ღირებულება, დარწმუნდით, რომ ფუნქციები ხელმისაწვდომია, როდესაც is_admin () ბრუნდება ნამდვილი და ყალბი.

// დაამატეთ კალათის ბმული მენიუში
ფუნქცია wpex_add_menu_cart_item_to_menus ($ ელემენტი, $ არგუმენტი) {

// დარწმუნდით, რომ შეცვალეთ 'wpex_main' თქვენი მენიუს მდებარეობაში !!!!
if ($ args-> theme_location === 'wpex_main') {

$ css_class = 'მენიუ-ელემენტი მენიუ-პუნქტი-კალათა მენიუ-ნივთი-ტიპი-ვოკომოქსი-კალათა';

თუ (is_cart ()) {
$ css_class. = 'მიმდინარე-მენიუ-პუნქტი';
}

$ საკითხი. = '
  • '; $ საკითხი. = wpex_menu_cart_item (); $ საკითხი. = '
  • '; } $ ნივთების დაბრუნება; } add_filter ('wp_nav_menu_items', 'wpex_add_menu_cart_item_to_menus', 10, 2); // ფუნქცია ბრუნდება მთავარი მენიუს კალათის ბმული ფუნქცია wpex_menu_cart_item () $ გამომავალი = ''; $ cart_count = WC () -> კალათა-> cart_contents_count; $ css_class = 'wpex-menu-cart-total wpex-cart-total-'. ინვალი ($ cart_count); თუ ($ cart_count) { $ url = WC () -> კალათა-> get_cart_url (); სხვაგან $ url = wc_get_page_permalink ('მაღაზია'); } $ html = $ cart_extra = WC () -> კალათა-> get_cart_total (); $ html = str_replace ('თანხა', '', $ html); $ გამომავალი. = ''; $ გამომავალი. = ''; $ გამომავალი. = wp_kses_post ($ html); $ გამომავალი. = ''; $ გამომავალი დაბრუნება; } // განაახლეთ კალათის ბმული AJAX- თან ფუნქცია wpex_main_menu_cart_link_fragments ($ ფრაგმენტები) { $ fragments ['. wpex-menu-cart-total'] = wpex_menu_cart_item (); $ ფრაგმენტების დაბრუნება; } add_filter ('add_to_cart_fragments', 'wpex_main_menu_cart_link_fragments');

    დასკვნა

    WooCommerce სტანდარტულად იმუშავებს ნებისმიერ თემასთან, მაგრამ მოდულის დამატებით მხარდაჭერას დაამატებთ ისე, რომ უკეთესად მოერგოს თქვენს თემას, ამის გაკეთება ძალიან მარტივია. მე დავწერე ეს პოსტი ჩვენი ნიუ – იორკის WordPress დღიური და მაღაზიის თემის კოდირებისას, ასე რომ ამ რჩევების უმეტესობა შედის ჩვენს თემაში. ან თუ გსურთ, შეგიძლიათ შეიძინოთ თემა, რომ გადახედოთ როგორ გაკეთდა ყველაფერი (იხილეთ ფაილები wpex-new-york / inc / woocommerce– ში) – ეს შეიძლება იყოს თქვენთვის უფრო მარტივი გზა, რომ ისწავლოს სწორად დამატება WooCommerce მოდულის პერსონალური მხარდაჭერა უკვე დაშიფრული თემის გადახედვით.

    არსებობს თუ არა სხვა ბროშურები, რომლებიც თვლით ამ ჩამონათვალს, ან იქნებ გამოსადეგი აღმოჩნდეთ WooCommerce– ის ახალი თემების შემუშავებისას.?

    Jeffrey Wilson Administrator
    Sorry! The Author has not filled his profile.
    follow me
      Like this post? Please share to your friends:
      Adblock
      detector
      map