W świecie rozwoju WordPressa posiadanie odpowiednich narzędzi może mieć ogromne znaczenie. Dlatego z radością ogłaszamy wprowadzenie na rynek nowej aplikacji Code App firmy Assistant – wszechstronnego i potężnego narzędzia zaprojektowanego w celu usprawnienia przepływu pracy związanego z kodowaniem i ułatwienia zarządzania fragmentami kodu w WordPress.

Aplikacja Code znajduje się we wtyczce Asystent i umożliwia tworzenie, edytowanie i zarządzanie fragmentami kodu CSS i JavaScript dla Twojej witryny internetowej. Dzięki aplikacji Code możesz łatwo dodawać nowe fragmenty, przypisywać je do określonych sekcji i kontrolować ich stan aktywacji. Funkcje obejmują powielanie, eksportowanie i zapisywanie fragmentów w bibliotece (z Asystentem Pro). Intuicyjny interfejs zapewnia szybkie przełączanie między włączonymi i wyłączonymi fragmentami, usprawniając proces dostosowywania witryny.

Zanurzmy się i odkryjmy niektóre z jego innowacyjnych funkcji i możliwości:

Co to jest aplikacja Assistant Code?

Być może już wiesz, że możesz zapisywać fragmenty kodu w bibliotekach Assistant Pro. Teraz, po dodaniu aplikacji Code, możesz łatwo dodawać, edytować i zarządzać fragmentami kodu swojej witryny WordPress, a wszystko to w ramach wtyczki Asystent:

Aplikacja Code zastępuje potrzebę stosowania wielu wtyczek i zwiększa produktywność, zapisując wszystkie fragmenty kodu witryn internetowych w jednym, łatwo dostępnym miejscu.

• Łatwe zarządzanie fragmentami kodu: zarządzaj kodem CSS i JavaScript swojej witryny bezpośrednio w aplikacji Code. Koniec z żonglowaniem wieloma narzędziami i platformami, wszystko, czego potrzebujesz, jest na wyciągnięcie ręki.
• Zapisz fragmenty kodu w chmurze Assistant Pro: Aplikacja Assistant Code płynnie integruje się z kontem Assistant Pro, umożliwiając zapisywanie i organizowanie fragmentów kodu w bibliotekach w chmurze. Usprawnij przepływ pracy, z łatwością ponownie wykorzystując fragmenty kodu w wielu projektach witryn internetowych, oszczędzając cenny czas.
• Współpracuj ze swoim zespołem: Współpraca jest kluczowa, a nasza aplikacja Code sprawia, że ​​praca z zespołem jest łatwiejsza niż kiedykolwiek. Dzięki edycji w czasie rzeczywistym możesz współpracować nad swoją witryną WordPress w czasie rzeczywistym i pozostawać w synchronizacji ze swoim zespołem bez względu na to, gdzie się znajdujesz.

Oprócz tych funkcji aplikacja Assistant's Code oferuje również elegancki i intuicyjny interfejs zaprojektowany z myślą o programistach. Niezależnie od tego, czy jesteś doświadczonym profesjonalistą, czy dopiero zaczynasz, uważamy, że nasza aplikacja Code będzie łatwa w obsłudze i prosta w użyciu.

Jak dodać fragment kodu w WordPress

Aplikacja Assistant Code oferuje bezproblemowy sposób ulepszania witryny internetowej za pomocą niestandardowych fragmentów CSS i JavaScript. Rozpoczęcie jest proste:

Krok 1: Otwórz aplikację Code w Asystencie

Jeśli jeszcze tego nie zrobiłeś, zainstaluj i aktywuj wtyczkę Asystenta. Po zainstalowaniu kliknij ikonę ołówka, aby otworzyć pasek boczny Asystenta. Przejdź do Aplikacje i ustawienia, a następnie kliknij Kod na liście aplikacji:

Pamiętaj, że jeśli chcesz, aby ikona aplikacji Code była wyświetlana na pasku bocznym, możesz zmienić kolejność aplikacji, przeciągając aplikację Code wyżej na liście:

Krok 2: Utwórz fragment kodu za pomocą aplikacji Code

Teraz jesteśmy gotowi, aby utworzyć nasz pierwszy fragment kodu. W tym przykładzie utwórzmy plik CSS, najpierw upewniając się, że wybrana jest karta CSS, następnie wprowadź tytuł i kliknij przycisk powrotu:

Na następnym ekranie zobaczysz, że aplikacja Code akceptuje następujące elementy:

• Tytuł: jest to unikalna nazwa fragmentu kodu.
• Opis: Wyjaśnij, do czego używany jest kod, lub podaj inne ważne informacje, które Ty lub Twój zespół powinniście zapamiętać:

• Fragment kodu : Wprowadź fragment kodu w bloku kodu:

Przewiń w dół do sekcji Lokalizacja i przypisz status i reguły do ​​swojego fragmentu kodu:

• Stan : Przełącz, aby włączyć lub wyłączyć status fragmentu kodu.
• Reguły : wybierz, gdzie chcesz załadować ten fragment. Wygląda to podobnie do zasad lokalizacji Themeru. Kliknij opcję Dodaj regułę , aby włączyć dodatkowe reguły.

Krok 3: Kliknij Aktualizuj, aby zapisać zmiany

Po zakończeniu dodawania fragmentu kodu w aplikacji Assistant Code kliknij przycisk Aktualizuj znajdujący się w prawym górnym rogu, aby zapisać zmiany:

Następnie odśwież stronę, aby zmiany odniosły skutek.

Duplikuj, zapisz w bibliotece, eksportuj lub usuwaj fragmenty kodu

Po dodaniu pierwszego fragmentu kodu za pomocą aplikacji Code przyjrzyjmy się dodatkowym funkcjom. Przewiń w dół do sekcji Lokalizacja, aby znaleźć opcje w sekcji Działania:

Tutaj możesz zarządzać ustawieniami fragmentów, takimi jak włączanie, powielanie, eksportowanie lub zapisywanie w bibliotece za pomocą programu Assistant Pro, co zapewnia większą kontrolę i elastyczność w zakresie dostosowywania witryny.

• Duplikuj: utwórz dokładną kopię bieżącego fragmentu kodu. Możesz także kliknąć ikonę duplikatu podczas przeglądania widoku listy typu kodu w aplikacji Code.
• Zapisz w bibliotece: Do zapisywania w bibliotece w chmurze wymagane jest połączenie z programem Assistant Pro. Kiedy zapiszesz fragment w bibliotece, nie zostanie zapisana lokalizacja, do której przypisałeś fragment. Kiedy importujesz fragment z biblioteki, musisz przypisać fragment do lokalizacji.
• Eksportuj: Eksportuj plik fragmentu kodu jako plik .txt.
• Usuń: spowoduje to trwałe usunięcie fragmentu kodu z Asystenta. Zobaczysz komunikat potwierdzający, że chcesz usunąć fragment. Tej akcji nie można cofnąć.

Teraz, gdy klikniesz ikonę aplikacji Code, zobaczysz wszystkie fragmenty kodu w widoku listy i wszystko w jednym miejscu:

Pamiętaj, że w widoku listy możesz włączać i wyłączać poszczególne fragmenty bez konieczności edytowania każdego z osobna, oszczędzając czas i wysiłek. Jeśli fragment jest wyłączony, zobaczysz komunikat Wyłączony , a jeśli jest włączony, wyświetli się komunikat Włączony z zieloną kropką. Możesz to szybko przełączyć, klikając ten wskaźnik.

Przykłady fragmentów kodu WordPress

Istnieje wiele fragmentów kodu CSS i JavaScript dla WordPressa , które są powszechnie używane do zwiększania funkcjonalności, elementów stylu lub dodawania interaktywności do stron internetowych. Oto kilka popularnych przykładów:

Fragmenty kodu CSS

• Niestandardowe czcionki: Implementuj niestandardowe czcionki za pomocą CSS, albo z czcionek Google, albo z innych źródeł.
• Stylizacja formularzy: dostosuj wygląd i styl formularzy w swojej witrynie WordPress.
• Ukryj elementy: kod CSS umożliwiający ukrycie określonych elementów lub sekcji witryny.
• Animacje: animacje CSS lub przejścia umożliwiające dodanie efektów wizualnych do elementów.
• Efekty najechania: dodaj efekty najechania do przycisków, linków, obrazów itp.
• Dostosowywanie menu nawigacyjnych: Dostosuj menu nawigacyjne do projektu i układu witryny.
• Przyklejone nagłówki/stopki: spraw, aby nagłówki lub stopki przylegały do ​​góry lub do dołu strony podczas przewijania przez użytkowników.
• Tryb ciemny: Zaimplementuj motyw trybu ciemnego dla swojej witryny za pomocą CSS.

Fragmenty kodu JavaScript

• Płynne przewijanie: kod JavaScript umożliwiający płynne przewijanie, gdy użytkownicy klikają linki wewnętrzne.
• Leniwe ładowanie obrazów: Zaimplementuj leniwe ładowanie, aby skrócić czas ładowania strony, ładując obrazy tylko wtedy, gdy są potrzebne.
• Okna modalne: Twórz okna modalne lub wyskakujące okienka do wyświetlania dodatkowej treści lub wiadomości.
• Akordeon/sekcje zwijane: kod JavaScript umożliwiający tworzenie sekcji w stylu akordeonu, które po kliknięciu rozwijają się lub zwijają.
• Przełącz widoczność: kod JavaScript służący do przełączania widoczności elementów na stronie.
• Nieskończone przewijanie: ładuj więcej treści, gdy użytkownicy przewijają stronę w dół, bez konieczności klikania linków do stronicowania.
• Menu rozwijane: ulepsz menu nawigacyjne za pomocą funkcji rozwijanych za pomocą JavaScript.
• Suwak/karuzela: Twórz suwaki lub karuzele obrazów, aby prezentować zawartość w atrakcyjny wizualnie sposób.
• Ajax Load More: dynamicznie ładuj dodatkową zawartość bez ponownego ładowania całej strony, przydatne w przypadku blogów i portfolio.

To tylko kilka przykładów. Istnieje niezliczona ilość innych fragmentów CSS i JavaScript, których możesz użyć do dostosowania i ulepszenia swojej witryny WordPress. Jak zawsze, przed rozpoczęciem wykonaj kopię zapasową swojej witryny i upewnij się, że dodany kod jest odpowiednio przetestowany i nie koliduje z istniejącym motywem lub wtyczkami.

Wniosek

Chcesz przenieść proces projektowania stron internetowych na wyższy poziom? Nie szukaj dalej niż najnowszy dodatek do naszej wtyczki Asystent, aplikacja Code . Niezależnie od tego, czy pracujesz nad kolejnym projektem WordPress, czy rozwiązujesz wyzwanie związane z kodowaniem, to narzędzie ma na celu usprawnienie przepływu pracy i zwiększenie produktywności.

Ale to nie wszystko – dzięki bezpłatnemu kontu Assistant Pro odblokujesz jeszcze więcej funkcji, które usprawnią Twój proces programowania. Dołącz do innych twórców stron internetowych, aby odzyskać cenny czas i bez wysiłku organizować swoje projekty. Nie czekaj dłużej – zarejestruj się już dziś i przekonaj się, jaka jest różnica!