Dziś jeden z bardzo niewielu (jak dotychczas) wpisów z serii "Pchełki WordPress".
Nie jestem fachowcem od WordPress-a, nie znam się na PHP, a HTML-a oraz CSS-a ledwie liznąłem. Zasadniczo staram się trzymać z dala od technologii webowych; między innymi ze względu na ich straszliwą mnogość, w której idzie się pogubić.
Jeżeli czytasz po angielsku, polecam lekturę tego cudeńka: !klik!
Czasem jednak nadchodzi taki moment, że trzeba zakasać rękawy i grzebnąć w kodzie blogu, żeby uzyskać pożądany efekt.
Dziś przepis na ukrycie bocznego paska (marginesu) w widoku pojedynczego wpisu.
Ostrzegam, metoda nie jest uniwersalna, dla każdego motywu może wyglądać odrobinę inaczej. Ja używam (chwilowo) motywu TwentySixteen (domyślny motyw WordPress z zeszłego roku), który standardowo wyświetla boczny pasek zarówno w widoku strony głównej (lista postów) jak też pojedynczego postu.
Jeżeli chcemy, żeby pojedynczy post był wyświetlany na całej szerokości strony (bez paska bocznego), musimy zrobić dwie rzeczy:
- Ukryć pasek boczny oraz
- Ustawić szerokość treści (czyli wpisu właściwego) na 100%
W przypadku motywu TwentySixteen wygląda to następująco:
- Wchodzimy w ustawienia własnego CSS (można to zrobić na pierdylion sposobów, na przykład za pomocą JetPack-a albo osobnej wtyczki)
- Wpisujemy tam dwie linijki:
.single-post aside {display: none;}
.single-post .content-area {width: 100%;}
Pierwsza linijka ukrywa boczny pasek, druga "rozciąga" treść wpisu w poziomie na całą szerokość.
Ale skąd właściwie wiemy, że akurat to trzeba wpisać?
Otóż wiemy to dzięki funkcji "Inspect" przeglądarki (zarówno w Firefoxie jak i w Chrome funkcja działa prawie identycznie). Klikamy prawym myszem w boczny pasek, wybieramy "Inspect" i patrzymy, na jakim elemencie się ustawił kursor. Tenże element (w tym przypadku: aside) musi się koniecznie znajdować wewnątrz elementu klasy .single-post (w przeciwnym razie wyłączymy sobie pasek całkowicie i wszędzie, a tego nie chcemy).
W podobny sposób namierzamy element .content-area.
W innych motywach te elementy mogą nazywać się inaczej, ale .single-post będzie wspólne dla wszystkich (to jest standardowy "kawałek" WordPress-a).
Ot i cała tajemnica.
Większość roboty w WordPressie można zrobić za pomocą przeróżnych wtyczek. Czasami jednak przydaje się znajomość kodu czy stylów by jeszcze coś dodatkowego w WP poprawić.
Wszystko zależy od poziomu wiedzy technicznej właściciela strony. Jedni zbudują coś pięknego z niczego, inni spieprzą najlepszy motyw jedną linijką koślawego kodu 😉