Cześć i czołem,
Mam blok taki jak wyżej (rodzaj bloku to cytat wyróżniony). Chcę zrobić tak, aby cytat miał swoją czcionkę i podpis pod cytatem też swoją. Nie mam możliwości wyboru konkretnego rodzaju czcionki z poziomu edycji bloku (tylko opcje na zasadzie "zwykła kursywa", "gruba kursywa" itk.) + edycja bloku pozwala wyłącznie na wybór jednej opcji wyglądu dla całości bloku. Czy jest możliwość, aby przede wszystkim wybrać konkretny rodzaj czcionki dla cytatu i oddzielny dla podpisu pod cytatem? Z góry dziękuję za odpowiedzi ;)
Hej!
Tak, jest taka możliwość, choć wymaga to zastosowania niestandardowego CSS więc wchodzimy na nieco wyższy level 😀
Aby to zrobić, będziesz potrzebował dostępu do edycji CSS na swojej stronie, np. sekcji Dostosuj motywu znajdziesz zakładkę gdzie można wstawić własny CSS.
Co trzeba zrobić:
Znajdź selektory CSS dla bloku cytatu i jego podpisu: Najpierw musisz zidentyfikować, jakie selektory CSS są używane dla bloku cytatu i podpisu w Twoim motywie. Możesz to zrobić, korzystając z narzędzi deweloperskich w przeglądarce (np. w Firefoxie lub Chrome).
Jeśli nie wiesz jak to namierzyć daj znać.
Dodaj niestandardowy CSS: Po zidentyfikowaniu selektorów, możesz dodać niestandardowe reguły CSS do wspomnianej zakładki w sekcji Dostosuj motywu.
Przykład niestandardowego CSS:
.wp-block-quote p {
font-family: 'TwojaCzcionkaDlaCytatu', serif; /* Zmień 'TwojaCzcionkaDlaCytatu' na nazwę faktycznej czcionki */
}
.wp-block-quote cite {
font-family: 'TwojaCzcionkaDlaPodpisu', sans-serif; /* Zmień 'TwojaCzcionkaDlaPodpisu' na nazwę faktycznej czcionki */
}
Zastąp 'TwojaCzcionkaDlaCytatu' i 'TwojaCzcionkaDlaPodpisu' nazwami czcionek, których chcesz użyć. Upewnij się, że czcionki te są dostępne na Twojej stronie, na przykład przez Google Fonts lub są to czcionki systemowe.
Po dodaniu CSS, zapisz zmiany i odśwież stronę, aby zobaczyć efekt. Może być konieczne wyczyszczenie pamięci podręcznej przeglądarki i/lub wtyczki cache jeśli taką masz.
Pamiętaj, że dokładne selektory mogą się różnić od tych które podałem w zależności od używanego motywu i wersji Gutenberga, jeśli więc nie zadziała warto sprawdzić aktualne selektory przy pomocy narzędzi deweloperskich w przeglądarce o czym wspomniałem powyżej.
Dziękuję za odpowiedź, podziałało ;) Chociaż mi osobiście było łatwiej namierzyć używane selektory CSS poprzez wybranie opcji "edytuj w HTML" na bloku.