Wszystko o motyw | Webinsider - Internet widziany od środka ™

Tag: motyw

Blokowe szablony powiadomień (block notice) w WooCommerce, nawet w klasycznych motywach

Kilka dni temu opublikowałem artykuł o premierze nowej wersji WordPressa (6.5), co było dość niezwykłe – artykuł, nie nowa wersja WordPressa, bo od dawna większość nowości w kolejnych aktualizacjach, to  głównie nowości w edytorze blokowym, typu “teraz możesz w module X ustawić kolor dla Y”, ale pojawiła się ciekawa opcja, choć raczej dla twórców wtyczek, to o niej napisałem. Kilka dni temu była też premiera nowej wersji WooCommerce (8.8.2), i tu sytuacja analogiczna, czyli zazwyczaj nie mam o czym pisać (bo jak nie edytor blokowy, to nowości w nowym edytorze – oczywiście blokowym – produktów, który na razie do użytku innego niż testy nie bardzo się nadaje). Jednak pojawiła się jedna nowość, o której chcę napisać…

Sterowanie zachowaniem segmentów w module akordeonu w motywie Divi za pomocą kodu CSS i JavaScript, czyli sam decydujesz, co ma być na początku otwarte, a co zamknięte

Napisała do mnie z prośbą o pomoc i konsultację czytelniczka, która – jak to określiła – czuje się nabita w butelkę, bo “kobieta uwierzyła kobiecie”, że nie musi mieć żadnej wiedzy technicznej, by w jedno popołudnie wyklikać sobie stronę, a w weekend nawet i sklep internetowy. No cóż, temat “wyklikanych w stronę” (taka kontekstowa wersja nabitych w butelkę) mam na liście i prędzej czy później i nad nim się pochylę, ale to nie dziś. Dziś zajmiemy się z jednym z tematów, z którymi zwróciła się do mnie wspomniana czytelniczka i obecnie już też i klientka.

Divi AI Image Editor i Divi Code AI, czyli w Divi za pomocą AI już nie tylko wygenerujesz tekst i grafikę, ale też ją zmodyfikujesz, a nawet wygenerujesz kod CSS, HTML i JavaScript

Dziś w kontekście AI (Sztucznej Inteligencji, SI) pewnie wypadałoby napisać o nowym “produkcie” od OpenAI, czyli Sora, czyli nowym modelu do generowania filmów wideo, przy którym liczne serwisy do generowania wideo za pomocą AI wypadają… No średnio, ale to i tak będzie eufemizm. Ja jednak uznałem, że to dobry moment, by nadrobić zaległości w kontekście AI i motywu Divi do WordPressa.

W Divi 5 dev-beta 3, czyli edytor Divi bez krótkich kodów, a na formacie JSON, czyli rozwiązaniu znanym z Gutenberga

Ukazała się trzecia dev-beta motywu Divi 5 od Elegant Themes, a więc nadchodzącej “dobrej zmiany”, jeśli chodzi o motyw Divi – ma być szybciej, nowocześniej, lepiej i ogólniej fajniej. Jednym z elementów tej zmiany jest program Shortcodes Minus, czyli odejście Divi Buildera (wizualnego edytora w Divi) od krótkich kodów, a przejście na bardziej nowoczesny i wydajny format, znany choćby z Gutenberga. I właśnie w Divi 5 dev-beta 3 można już sprawdzić, jak to wygląda i działa…

Generator memów “ja jestem zagrożeniem” z Jarosławem Kaczyńskim, czyli koń trojański PiS w obozie PO/KO znowu w akcji, albo…

Choć na łamach Webinsider.pl staram się unikać polityki, to od czasu do czasu coś związanego z polityką się trafi. I to nie tylko dlatego, że “my się możemy nie interesować polityka, ale polityka interesuje się nami”, a po prostu od czasu do czasu trafi się jakaś perełka. A czasem będzie to nie pojedyncza perełka, a cały ich koszyczek. I tak wczoraj dostałem link do generatora memów (?) przygotowanego – jak wynika z informacji na stronie – przez “KKW KOALICJA OBYWATELSKA PO .N IPL ZIELONI”, a jak do tego dodać jeszcze “osobowości” takie jak Arkadiusz “Belzebub” Myrcha, to właściwie jest pewne, że będzie śmiesznie. I się nie pomyliłem…

W motywie brakuje arkusza stylów style.css, czyli jak (prawidłowo) zainstalować kupiony motyw w WordPressie

Jednym z relatywnie częstych, a zarazem dość zabawnych błędów, jaki wiąże się z WordPressem, zwłaszcza w kontekście osób zaczynających swoją przygodę z tym CMSem, jest błąd “w motywie brakuje arkusza stylów style.css”, jaki pojawia się podczas próby instalacji motywu pobranego z jakiegoś serwisu, często, o ile nie najczęściej, dotyczy to kupnych motywów tzw. premium, gdzie po zakupie otrzymujemy najczęściej dostęp archiwum ZIP z motywem.

Opinie w sklepie internetowym na WooCommerce zgodne z Omnibusem to coś więcej, niż “zweryfikowany właściciel”

Pakiet ustaw potocznie zwany Omnibus jest z nami już prawie od pół roku, ale to nie oznacza, że wszystko i u wszystkich wdrożone. W ostatnich dniach przeprowadzaliśmy konsultację sklepu internetowego, również od strony podstawowych wdrożeń związanych właśnie z Omnibusem. Jednym z elementów, który musieliśmy umieścić na liście zadań do zrobienia, był moduł odpowiedzialny za opinie. Niby funkcjonujący prawidłowo, ale właśnie – niby…

W ramach usługi Divi Cloud pojawiła się możliwość zapisywania i wczytywania ustawień motywu Divi (Theme Option Presets)

W wielu projektach stron internetowych (w większości?) korzystam z bazowego zbioru rozwiązań, takich jak np. WordPress, konkretny zestaw wtyczek i odpowiedni motyw. Często tym motywem jest Divi od Elegant Themes. Nie jest to motyw idealny, ale wiem, jak działa, a do tego dość łatwo przekazać taką stronę pod zarządzanie – przynajmniej jeśli chodzi szeroko rozumiane “treści” – nawet “mniej technicznym” użytkownikom. Dlatego też staram się zautomatyzować co tylko się da – dodawanie domeny do serwera, aktywacja certyfikatu SSL (Let’s Encrypt), instalacja i bazowa konfiguracja WordPressa, wraz ze startowym zestawem wtyczek. Mógłbym do tego dodać jeszcze jakąś bazową bazę danych, z podstawową konfiguracją, ale jest z tym więcej problemów, niż potencjalnych zysków. Stąd wiele czynności konfiguracyjnych każdorazowo wykonuję “ręcznie”. Na szczęście dzięki ostatniej aktualizacji motywu Divi, z tej listy mogę skreślić podstawową konfigurację tego motywu.

Dodawanie niestandardowego kodu HTML i JavaScript do wybranych elementów strony za pomocą JavaScript, na przykładzie WordPressa

Dostałem zapytanie o umieszczenie formularza zapisu do newslettera w ramach usługi MailerLite na stronie internetowej działające na WordPressie. Niby nic nadzwyczajnego, ale tutaj miejsce, gdzie ów kod miał być umieszczony, było bardzo precyzyjnie wybrane i niekoniecznie łatwo dostępne do modyfikacji.

Zmiana kolejności wyświetlania kolumn w widoku mobilnym za pomocą CSSa na przykładzie WordPressa, WooCommerce i Divi

Trafiłem dziś na pytanie na temat zmiany kolejności wyświetlania paska bocznego (sidebar) i listy produktów w widoku archiwum WooCommerce (sklep internetowy na WordPressie) dla urządzeń mobilnych, gdzie w standardzie wyświetlają się najpierw produkty, a potem zawartość paska bocznego (widżety), niezależnie od tego, czy będzie on standardowo po lewej, czy prawej stronie. Co ma zresztą sens, bo nawet jeśli w bocznej sekcji – tak jak w tym przypadku było – są filtry produktów, to jednak produktami będą zainteresowani raczej wszyscy odwiedzający sklep, a filtrami tylko niektórzy.

Kod CSS dla wybranych produktów w WooCommerce, czyli gdy strona produktu ma wyglądać trochę inaczej niż pozostałe

Kilka dni temu, na “skrzynkę redakcyjną” wpłynęło “zapytanie premium” o możliwość modyfikacji pewnych elementów  graficznych na stronach poszczególnych produktów. Strona działa na dobrze znanym mi motywie Divi, więc teoretycznie można by skorzystać z opcji “theme builder”, by dla wybranych produktów przygotować inny wygląd. Jednak zmiany choć drobne – zmiana koloru dla kilku wybranych elementów, to miały docelowo dotyczyć wszystkich produktów w sklepie, a więc tworzenie dla każdego produktu oddzielnego szablonu choć możliwe, to w tym przypadku raczej nie byłoby najlepszym sposobem. Zwłaszcza że wszystko można było ogarnąć dosłownie 2-3 linijkami kodu CSS.

Wczytywanie różnych szablonów dla Custom Post Types w WordPressie, np. na podstawie kategorii

Pod koniec ubiegłego roku (2021) opublikowałem artykuł o tym, jak w prosty sposób stworzyć w WordPressie własne typy postów (Custom Post Types). Niedawno dostałem pytanie, jak można dla własnego typu postów stworzyć różny wygląd postu, zależnie od tego, do jakiej kategorii będzie przypisany.

Alternatywny sposób na zapytania ofertowe w WooCommerce z wykorzystaniem koszyka i pełnym wsparciem dla atrybutów

Pracuję obecnie nad projektem, gdzie WooCommerce (wtyczka sklepu internetowego do WordPressa) pełni rolę rozbudowanego katalogu produktów, a więc nie ma możliwości zakupu, jak w klasycznym sklepie internetowym, ale można przeglądać produkty i w razie chęci skontaktować się z przedstawicielem sklepu, by ustalić szczegóły. Oczywiście jest strona kontakt, z której można skorzystać, ale oprócz tego ważne jest, by można było wysłać zapytanie w sprawie konkretnego produkt, w konkretnej konfiguracji. A to już trochę komplikuje sytuację, zwłaszcza jeśli – jak we wspomnianym przypadku – formularz konfiguracji produktu jest bardzo rozbudowany…

Full Site Editing (FSE) w WordPressie na przykładzie Twenty Twenty-Two, czyli wirus Gutenbergiozy zaatakował edycję menu na stronie

Niedawno miała miejsce premiera WordPressa 5.9, i jak to od dawna już bywa, premiera właściwie dla mnie obojętna, bo większość nowości to kolejne usprawnienia i nowości w edytorze blokowym (Gutenberg), z którego nie korzystam. Właściwie, bo pojawiło się “małe zamieszanie” w połączeniu z wtyczką Tutor LMS i PHP 8.0, o czym niedawno pisałem. Ale jest jeszcze jedna nowość, z która w ostatnich dniach miałem wątpliwą przyjemność się zmierzyć. Na szczęście tylko w ramach eksperymentu.

Szybsze działania rozbudowanej strony na WordPressie dzięki kontroli uruchamiania wtyczek (uruchamianie selektywne)

Kwestia optymalizacji szybkości działania stron to temat, na który można by pewnie pisać i pisać. Sam do zwolenników “optymalizacji” pod wyniki (!) z Google PageSpeed Insights czy GTmetrix nie należę, i jeśli mam do wyboru szeroko rozumianą użyteczność strony internetowej lub lepszy wynik we wspomnianych testach, najczęściej wybiorę to pierwsze. Nie oznacza to jednak, że szybkość działania strony nie ma dla mnie znaczenia, bo ma. Z tym że nie w kontekście wspomnianych testów czy mitycznych “użytkownik czeka na wczytanie strony 3 sekundy, a potem zamyka stronę”. I tak ostatnio optymalizowałem działanie jednego sklepu, który jednocześnie był platformą kursową oraz webinarową.

Wyświetlanie własnej treści w wybranym miejscu na stronie działającej na WordPressie

Kilka dni temu odezwał się do mnie jeden z użytkowników wtyczki “PRyC WP: Add custom content to post and page (top/bottom)” do WordPressa (tutaj znajduje się artykuł na temat tej wtyczki). Potrzebował wsparcia, bo zawartość dodawana na dole postów przez wtyczkę wyświetlała się przed dodatkowo zdefiniowanym polem we wtyczce ACF. I nie pomaga dostępna od jakiegoś czasu opcja pozwalająca ustawić priorytet. Po wymianie kilku zdań wszystko stało się jasne – dodatkowe pole utworzone przez wtyczkę ACF wyświetlało się po głównej zawartości posta, gdy tymczasem wtyczka “PRyC WP: Add custom content to post and page (top/bottom)” operuje bezpośrednio na tej zawartości (funkcja/filtr the_content()), czyli tym samym oczywiste, że będzie przed.

Prosty sposób na skasowanie przycisku “zamów ponownie” w szczegółach zamówienia w WooCommerce

Drugim z zapowiadanych na dziś krótkich, acz konkretnych artykułów dotyczących WooCommerce jest temat przycisku “zamów ponownie”, jaki znajduje się w szczegółach zamówienia. Przycisk w wielu sytuacjach ma sens, i dobrze, że tam jest, ale są sklepy/towary, gdzie jego sens jest znikomy, a wręcz może wprowadzać niepotrzebne zamieszanie…

Prosty sposób na dodanie przycisku “dodaj do koszyka” w widoku archiwum produktów w WooCommerce

Rano napisałem artykuł, który jeszcze się nie ukazał, bo uznałem, że skoro to jest (ten artykuł) pewnego rodzaju felieton, to trzeba go ubrać w jakąś bardziej techniczną otoczkę. A, że już dość późno (weekend się zaczyna ;-)), to na szybko z mojego archiwum potencjalnych tematów (Trello) wygrzebałem 2 tematu związane z WooCommerce. Na pierwszy ogień idzie (czasem brakujący) przycisk “dodaj do koszyka” w widoku archiwum produktów…

Dzięki Divi Global Color System możesz zmieniać kolory na stronie internetowej szybko i łatwo, czyli globalnie

Elegant Themes, czyli ekipa (firma) odpowiedzialna za rozwój m.in. motywu Divi widać, że złapała w żagle wiatr, który jakby chcieć nazwać, to wyraz “global” zdecydowanie w jego nazwie musiałby się znaleźć. Wraz z premierą Divi w wersji 4.0 pojawił się Divi Theme Builder, dzięki któremu w prosty sposób można zmienić wygląd dosłownie każdej (pod)strony na stronie WWW. Chwilę wcześniej mieliśmy premierę Divi Library Global Modules, czyli modułów globalnych, do wykorzystania na wielu stronach, oraz coś, co wiem, że zwłaszcza chwalą sobie m.in. koleżanki próbujące swoich sił w eCommerce, czyli Divi WooCommerce Builder, czyli graficzny edytor (page builder) stron produktowych w sklepie internetowym na WooCommerce. Kilka dni temu swoją premierę miał kolejny “global”, i choć pozornie mniej przełomowy, to są to tylko pozory…

Custom Post Types, czyli własne typy postów w WordPressie, na przykładzie Newsloga na Webinsider.pl

Tematy do opisania na Webinsider.pl (i notatki do nich) piętrzą się w kolejnych stosach m.in. w Trello, i pewnie jakbym się nie starał, o wszystkim nie dam rady napisać. W ten sposób niestety wiele tematów wartościowych nigdy się nie okazuje, bo zanim doczekają swojej szansy, są już nieaktualne (albo muszę robić od nowa notatki do nich). Są też tematy krótkie, ale na tyle  – przynajmniej w mojej ocenie – istotne, że warto choćby o nich wspomnieć (i to nie tylko po to, by generować UU na ich bazie ;-)). I właśnie do tych tematów, a konkretnie formatu, w jakim powinny być publikowane, robiłem już kilka podejść. To, co się nie sprawdziło, to zbiorcze zestawienia, czyli tzw. prasówka. Problemem z tym formatem był taki, że może i mały, ale ważny, i czasem dodatkowo pilny temat musiał czekać, aż uzbiera się przynajmniej kilka innych tematów, a gdy się uzbiera to – nie licząc czasu potrzebnego na przygotowanie – pojawiał się kolejny problem: tworzył się z tego kolejny duży artykuł, który zabierał często więcej czasu niż “normalny poradnik”. I tak, 21 maja 2020 zadebiutował na Webinsider.pl nowy format, który prawdopodobnie już zostanie, bo po tych kilku miesiące widzę, że się całkiem nieźle sprawdza…

Loading

Pin It on Pinterest