Korzystanie z edytora tekstu sformatowanego dla zawartości
Możesz użyć edytora tekstu sformatowanego Shopify, aby sformatować i opracować styl treści, które pojawią się w Twoim sklepie online.
Na tej stronie
- Gdzie używać edytora tekstu sformatowanego
- Dodaj zawartość HTML za pomocą edytora tekstu sformatowanego
- Formatuj tekst za pomocą edytora tekstu sformatowanego
- Wyczyść formatowanie w edytorze tekstu sformatowanego
- Wstaw tabele za pomocą edytora tekstu sformatowanego
- Wstaw linki za pomocą edytora tekstu sformatowanego
- Dodaj wewnętrzne i zewnętrzne linki za pomocą edytora tekstu sformatowanego
- Link do pliku w treści strony
- Wstaw obrazy za pomocą edytora tekstu sformatowanego
- Przesuń obraz i zmień jego rozmiar w edytorze tekstu sformatowanego
- Edytuj obraz w edytorze tekstu sformatowanego
- Wstaw filmy za pomocą edytora tekstu sformatowanego
- Wstaw pliki audio za pomocą edytora tekstu sformatowanego
- Dodaj lub usuń komentarze wewnętrzne w edytorze tekstu sformatowanego
Gdzie używać edytora tekstu sformatowanego
Edytora tekstu sformatowanego możesz używać, aby dodać lub edytować tekst w kilku miejscach w sklepie:
Jeśli korzystasz z szablonu Online Store 2.0, możesz dodać sekcje tekstu sformatowanego do swoich stron lub wzorców za pomocą edytora szablonów.
Dodaj zawartość HTML za pomocą edytora tekstu sformatowanego
Możesz wprowadzić zawartość HTML dla swoich postów na blogu, stron, opisów produktów i opisów kolekcji za pomocą edytora tekstu sformatowanego.
Kliknij przycisk </>
HTML, aby wyświetlić kod HTML zawartości w edytorze tekstu sformatowanego.
W widoku HTML można wprowadzić wiele zmian zawartości w edytorze tekstu sformatowanego. Możesz dodawać obrazy, filmy lub tabele za pomocą HTML oraz możesz debugować lub dostosowywać układ i styl zawartości.
Osadź widżet mediów
Jeśli chcesz osadzić widżet wideo lub widżet muzyczny, musisz najpierw umieścić go w serwisie takim jak Youtube, Vimeo lub SoundCloud. Te usługi generują kod do osadzania, który można skopiować i wkleić do edytora sformatowanego tekstu panelu administracyjnego Shopify.
Kroki:
- Znajdź kod osadzania dla multimediów, które chcesz osadzić.
- Wybierz cały kod do osadzenia, klikając go i naciskając
ctrl
+A
na komputerze PC lubcommand
+A
na komputerze Mac. - Skopiuj kod osadzenia, naciskając
ctrl
+C
na komputerze PC lubcommand
+C
na komputerze Mac. - W panelu administracyjnym Shopify kliknij przycisk Pokaż HTML w edytorze tekstu sformatowanego dla zawartości, którą chcesz edytować.
- Wklej kod osadzenia, naciskając
ctrl
+V
na komputerze PC lubcommand
+V
na komputerze Mac. - Kliknij opcję Zapisz.
Formatuj tekst za pomocą edytora tekstu sformatowanego
Za pomocą przycisku Formatowanie można szybko tworzyć akapity, nagłówki lub cytaty blokowe. Użycie odpowiednich poziomów formatowania i nagłówków ułatwia użytkownikom i wyszukiwarkom czytanie zawartości strony internetowej.
Aby wybrać format tekstu, zaznacz tekst, a następnie kliknij przycisk Formatowanie.
Opcje formatowania
Akapit
Nagłówek (1-6)
Cytat blokowy
Pogrubiony tekst
Aby pogrubić tekst, zaznacz go i kliknij przycisk Pogrubienie.
Pisanie tekstu kursywą
Aby uzyskać kursywę, zaznacz tekst i kliknij przycisk Kursywa.
Podkreśl tekst
Aby podkreślić tekst, zaznacz go i kliknij przycisk Podkreśl.
Utwórz wypunktowaną listę
Aby utworzyć listę z wypunktowaniem, kliknij przycisk Lista wypunktowana.
Pierwszą pozycję listy punktowanej możesz utworzyć, wpisując ją. Aby utworzyć nowe pozycje listy, naciśnij klawisz enter
lub return
. Aby zakończyć listę, naciśnij dwukrotnie klawisz enter
lub return
.
Utwórz listę numerowaną
Aby utworzyć listę numerowaną, kliknij przycisk Lista numerowana.
Pierwszą pozycję listy numerowanej możesz utworzyć, wpisując ją. Aby utworzyć nowe pozycje listy, naciśnij klawisz enter
lub return
. Aby zakończyć listę, naciśnij dwukrotnie klawisz enter
lub return
.
Wcięcie tekstu
Wcięcie akapitu powoduje utworzenie marginesu po lewej stronie. Aby wciąć akapit, kliknij przycisk Wcięcie.
Tekst bez wcięcia
Anulowanie wcięcia akapitu powoduje usunięcie wszystkich ustawionych marginesów wcięcia. Aby usunąć wcięcie akapitu, kliknij przycisk Anulowanie wcięcia.
Wyrównaj tekst
Aby wyrównać tekst, zaznacz tekst, kliknij przycisk Wyrównanie i wybierz Wyrównaj do lewej, Wyrównaj do środka lub Wyrównaj do prawej.
Zmiana koloru tekstu
- Zaznacz tekst i kliknij przycisk Kolor.
- Kliknij kolor lub wprowadź kod szesnastkowy, aby zmienić wyróżniony tekst na ten kolor.
Zmiana koloru tła tekstu
- Zaznacz tekst i kliknij przycisk Kolor.
- Kliknij kartę Tło.
- Kliknij kolor lub wprowadź kod szesnastkowy, aby zmienić tło wyróżnionego tekstu na ten kolor.
Wyczyść formatowanie w edytorze tekstu sformatowanego
Aby usunąć formatowanie z tekstu lub obrazów, zaznacz zawartość, a następnie kliknij przycisk Wyczyść formatowanie.
Wstaw tabele za pomocą edytora tekstu sformatowanego
Możesz dodawać tabele do postów na blogu, stron, opisów produktów i opisów kolekcji za pomocą edytora tekstu sformatowanego. W utworzonej tabeli możesz umieścić tekst, obrazy lub nawet filmy.
Kroki:
- W edytorze tekstu sformatowanego kliknij przycisk Wstaw tabelę.
- Kliknij Wstaw tabelę, aby wstawić tabelę. Spowoduje to utworzenie tabeli z jednym wierszem i jedną kolumną.
Po utworzeniu tabeli kliknij ponownie przycisk Wstaw tabelę, aby zmodyfikować wiersze i kolumny tabeli:
- Wstaw wiersz powyżej: Umieść kursor w rzędzie i kliknij ten przycisk, aby wstawić powyżej nowy wiersz.
- Wstaw wiersz poniżej: Umieść kursor w rzędzie i kliknij ten przycisk, aby wstawić poniżej nowy wiersz.
- Wstaw kolumnę przed: Umieść kursor w kolumnie i kliknij ten przycisk, aby wstawić nową kolumnę przed tą kolumną.
- Wstaw kolumnę po: Umieść kursor w kolumnie i kliknij ten przycisk, aby wstawić nową kolumnę po tej kolumnie.
- Usuń wiersz: Umieść kursor w wierszu, który chcesz usunąć, a następnie kliknij ten przycisk.
- Usuń kolumnę: Umieść kursor w kolumnie, którą chcesz usunąć, a następnie kliknij ten przycisk.
- Usuń tabelę: Umieść kursor w dowolnym miejscu tabeli, a następnie kliknij ten przycisk, aby usunąć całą tabelę.
Wstaw linki za pomocą edytora tekstu sformatowanego
Możesz dodawać linki (hiperlinki) w postach na blogu, stronach, opisach produktów i opisach kolekcji za pomocą edytora tekstu sformatowanego. Dodawane przez Ciebie linki mogą kierować klientów do stron w Twoim sklepie Shopify i do innych stron internetowych. Ponadto możesz dodawać linki, które otwierają wiadomości e-mail lub wykonują połączenia telefoniczne, aby pomóc klientom skontaktować się z Tobą.
Kroki:
Zaznacz tekst lub obraz, który chcesz zamienić w link.
Kliknij Wstaw link.
Wprowadź docelowy adres URL linku w polu Link do:
- Aby połączyć się z zewnętrzną stroną internetową poza sklepem Shopify, wprowadź
https://
oraz adres internetowy, np.https://www.example.com
. - Aby utworzyć link do strony sklepu online Shopify, wprowadź krótki adres URL, na przykład
/collections/summer-collection
. - Aby utworzyć link otwierający wiadomość e-mail, wprowadź
mailto:
oraz adres e-mail, np.mailto:example@example.com
. - Aby utworzyć link, który wykonuje połączenie telefoniczne, wprowadź
tel:
a następnie numer telefonu, np.tel:+0-123-456-7890
.
- Aby połączyć się z zewnętrzną stroną internetową poza sklepem Shopify, wprowadź
Wprowadź krótki opis linku w polu Tytuł linku.
Wybierz sposób otwierania linku za pomocą menu Otwórz ten link w:
- to samo okno: link otworzy się w istniejącej karcie lub oknie przeglądarki użytkownika.
- nowe okno: link otworzy się w nowej karcie lub oknie przeglądarki.
Kliknij Wstaw link, aby przekształcić podświetlony tekst w link.
Dodaj wewnętrzne i zewnętrzne linki za pomocą edytora tekstu sformatowanego
Linki do stron w Twoim sklepie Shopify nazywane są linkami wewnętrznymi. Możesz użyć krótkich adresów URL, aby utworzyć linki wewnętrzne. Na przykład adres URL /collections
wskaże stronę kolekcji Twojego sklepu.
Aby połączyć się z określoną stroną sklepu online, taką jak strona kolekcji lub produktu, użyj formatu adresu URL /page-type/page-handle
. Na przykład, aby połączyć się z utworzoną kolekcją o nazwie Summer Collection, użyj adresu URL /collections/summer-collection
.
Linki do stron internetowych znajdujących się poza sklepem Shopify nazywane są linkami zewnętrznymi. Linki zewnętrzne należy wprowadzić w całości i zacząć od http://
.
Link do pliku w treści strony
Po załadowaniu pliku możesz połączyć go z zawartością w edytorze tekstu sformatowanego, aby udostępnić go do pobrania z opisu produktu lub kolekcji, strony internetowej lub wpisu na blogu.
Kroki:
Pulpit
W panelu administracyjnym Shopify przejdź do opcji: Zawartość > Pliki.
Skopiuj adres URL pliku, który chcesz połączyć.
W panelu administracyjnym Shopify kliknij produkt, kolekcję, stronę internetową lub wpis na blogu, do którego chcesz dodać plik.
W edytorze tekstu sformatowanego wprowadź lub wybierz tekst linku.
Wybierz tekst linku.
Kliknij Wstaw link
W polu Link do wklej adres URL pliku, który chcesz podłączyć.
Kliknij Wstaw link. W edytorze tekstu sformatowanego podłączony tekst jest wyświetlany na niebiesko i jest podkreślony.
iPhone
- W aplikacji Shopify naciśnij przycisk …, a następnie Ustawienia.
- W sekcji Ustawienia sklepu naciśnij Pliki.
- Skopiuj adres URL pliku, który chcesz połączyć.
- W panelu administracyjnym Shopify naciśnij produkt, kolekcję, stronę internetową lub post na blogu, do którego chcesz dodać plik.
- W edytorze tekstu sformatowanego wprowadź lub wybierz tekst linku.
- Wybierz tekst linku.
- Naciśnij Wstaw link
- W polu Link do wklej adres URL pliku, który chcesz podłączyć.
- Naciśnij opcję Wstaw link. W edytorze tekstu sformatowanego podłączony tekst jest wyświetlany na niebiesko i jest podkreślony.
Android
- W aplikacji Shopify naciśnij przycisk …, a następnie Ustawienia.
- W sekcji Ustawienia sklepu naciśnij Pliki.
- Skopiuj adres URL pliku, który chcesz połączyć.
- W panelu administracyjnym Shopify naciśnij produkt, kolekcję, stronę internetową lub post na blogu, do którego chcesz dodać plik.
- W edytorze tekstu sformatowanego wprowadź lub wybierz tekst linku.
- Wybierz tekst linku.
- Naciśnij Wstaw link
- W polu Link do wklej adres URL pliku, który chcesz podłączyć.
- Naciśnij opcję Wstaw link. W edytorze tekstu sformatowanego podłączony tekst jest wyświetlany na niebiesko i jest podkreślony.
Wstaw obrazy za pomocą edytora tekstu sformatowanego
Istnieją trzy sposoby wstawiania obrazu za pomocą edytora tekstu sformatowanego. Możesz:
Prześlij obrazy
Kroki:
W edytorze tekstu sformatowanego kliknij przycisk Wstaw obraz.
W oknie dialogowym Wstaw obraz kliknij kartę Załadowane obrazy.
Naciśnij Załaduj plik.
Wybierz z komputera plik obrazu WebP, HEIC, SVG, GIF, JPEG lub PNG.
Kliknij załadowany obraz, aby go wybrać.
Z menu Rozmiar wybierz rozmiar wyświetlanego obrazu. Możesz wybrać Oryginał, aby wstawić obraz bez zmiany rozmiaru wyświetlania.
Kliknij Wstaw obraz, aby umieścić obraz w edytorze tekstu sformatowanego.
Wybierz spośród obrazów produktów
Kroki:
W edytorze tekstu sformatowanego kliknij przycisk Wstaw obraz.
W oknie dialogowym Wstaw obraz kliknij kartę Obrazy produktu.
Kliknij obraz, który chcesz wstawić. Jeśli nie możesz znaleźć multimediów produktu, który chcesz wstawić, możesz użyć przycisków strzałek, aby przejrzeć różne strony.
Z menu Rozmiar wybierz rozmiar wyświetlanego obrazu. Możesz wybrać Oryginał, aby wstawić obraz bez zmiany rozmiaru wyświetlania.
Kliknij Wstaw obraz, aby umieścić obraz produktu w edytorze tekstu sformatowanego.
Użyj adresu URL obrazu
Aby wstawić obraz przy użyciu publicznego adresu URL:
- W edytorze tekstu sformatowanego kliknij przycisk Wstaw obraz.
- W oknie dialogowym Wstaw obraz kliknij kartę URL.
- Wprowadź publicznie dostępny adres URL pliku obrazu.
- Kliknij Wstaw obraz, aby wstawić obraz w edytorze tekstu sformatowanego w oryginalnym rozmiarze.
Przesuń obraz i zmień jego rozmiar w edytorze tekstu sformatowanego
Po dodaniu obrazu do opisu produktu lub kolekcji, strony internetowej lub blogu możesz przenieść go do innej lokalizacji w zawartości.
Kroki:
W panelu administracyjnym Shopify kliknij produkt, kolekcję, stronę internetową lub wpis na blogu zawierający obraz, którego rozmiar chcesz zmienić lub który chcesz przenieść.
W edytorze tekstu sformatowanego kliknij obraz.
Wykonaj jedną z następujących czynności:
- Aby przenieść obraz, kliknij i przeciągnij go do innej lokalizacji w polu Zawartość.
- Aby zmienić rozmiar obrazu, kliknij i przeciągnij jeden z rogów.
Kliknij opcję Zapisz.
Edytuj obraz w edytorze tekstu sformatowanego
Możesz zmienić rozmiar, zawijanie tekstu i wyrównanie obrazu w edytorze tekstu sformatowanego. Ponadto możesz edytować adres URL obrazu lub dodawać bądź edytować tekst alternatywny.
Kroki:
Kliknij dwukrotnie obraz w edytorze tekstu sformatowanego, aby otworzyć okno dialogowe Edytuj obraz.
Użyj opcji rozmiaru i wyrównania, aby edytować obraz:
- Aby zmienić rozmiar obrazu, wybierz opcję rozmiaru.
- Aby poprawić pozycjonowanie stron (SEO) i dostępność swojego sklepu online, dodaj lub edytuj alternatywny tekst obrazu.
- Aby dodać odstępy, wprowadź liczbę pikseli odstępu po każdej stronie.
- Aby zmienić wyrównanie obrazu, wybierz ikony reprezentujące wyrównanie do lewej, do prawej lub do środka.
- Aby dodać zawijanie tekstu, zaznacz opcję Zawijaj tekst wokół obrazu.
Kliknij Edytuj obraz, aby zapisać zmiany.
Wstaw filmy za pomocą edytora tekstu sformatowanego
Możesz dodawać lub wstawiać filmy w postach na blogu, stronach, w opisach produktów i opisach kolekcji za pomocą edytora tekstu sformatowanego.
Jeśli chcesz osadzić utworzony film, musisz najpierw przesłać go do witryny strumieniowej transmisji wideo, takiej jak YouTube lub Vimeo.
YouTube nie zezwala na wyłączenie powiązanych filmów, ale możesz ustalić, że powiązane filmy powinny pochodzić z tego samego kanału, co właśnie odtwarzany film.
Kroki:
- Skopiuj adres URL filmu, naciskając
ctrl
+C
na komputerze PC lubcommand
+C
na komputerze z Mac.
- Odwiedź Embed Responsively. Embed Responsively to narzędzie tworzące ulepszony kod do osadzania Twojego filmu.
- Na stronie Embed Responsively wybierz witrynę wideo, w której znajduje się Twój film.
- Wklej adres URL filmu, który skopiowałeś(-aś) do pola URL strony na Embed Responsively, naciskając
ctrl
+V
na komputerze PC lubcommand
+V
na komputerze Mac. - Kliknij opcję Osadź. Embed Responsively utworzy dla Ciebie kod do osadzenia.
- Jeśli film pochodzi z YouTube'a i chcesz wyświetlić tylko powiązane filmy z tego samego kanału YouTube, znajdź adres URL filmu w kodzie osadzenia. Skopiuj i wklej na końcu
?rel=0
w cudzysłowie. - Skopiuj cały kod w polu Osadź kod.
- W panelu administracyjnym Shopify kliknij przycisk Wstaw film w edytorze tekstu sformatowanego.
- Wklej kod do osadzenia w polu w oknie dialogowym Wstaw film.
- Kliknij Wstaw film.
- Po zakończeniu kliknij Zapisz, aby zapisać zmiany w edytowanej pozycji.
Wstaw pliki audio za pomocą edytora tekstu sformatowanego
Możesz użyć edytora tekstu sformatowanego do wstawienia lub osadzenia plików audio na stronach, w postach na blogu, opisach produktów i opisach kolekcji.
Kroki:
W panelu administracyjnym Shopify przejdź do opcji: Zawartość > Pliki.
Kliknij Załaduj pliki, aby przesłać plik audio, który chcesz wstawić lub osadzić w swoim sklepie.
W sekcji Sklep online otwórz edytor tekstu sformatowanego dla strony lub wpisu na blogu, w którym chcesz umieścić plik audio.
Skopiuj
<div id="player"><audio controls="controls">
, a następnie wklej kod w edytorze tekstu sformatowanego, aby osadzić odtwarzacz audio na swojej stronie.Skopiuj następujący kod:
<source src="https://cdn.shopify.com/s/files/1/0220/2378/files/example.mp3" type="audio/mpeg" /></div>
Wklej ten kod w edytorze tekstu sformatowanego po kodzie dla odtwarzacza audio, a następnie zastąp adres
https://cdn.shopify.com/s/files/1/0220/2378/files/example.mp3
adresem URL utworzonym dla Twojego pliku audio po przesłaniu go do Shopify. Adres URL pliku audio można znaleźć w dowolnym momencie na stronie Pliki.Kliknij opcję Zapisz.
Kliknij Widok, aby upewnić się, że plik audio odtwarza się poprawnie.
Dodaj lub usuń komentarze wewnętrzne w edytorze tekstu sformatowanego
Możesz użyć tagów komentarza <!--
i -->
dla tekstu wewnętrznego, którego nie chcesz opublikować w swoim sklepie.
Kroki:
- W edytorze tekstu sformatowanego kliknij przycisk Pokaż HTML.
- Aby dodać komentarz wewnętrzny, umieść tekst, który chcesz ukryć między
<!--
i-->
. Na przykład:<!--yourtext-->
. - Kliknij opcję Zapisz.
Tagi HTML zawarte w tagach komentarza są zapisywane jako tekst wewnętrzny. Aby tagi takie działały poprawnie, musisz usunąć tagi komentarza <!--
i -->
wokół nich.