Jump to content

Jak znaleźć i zmienić fragment stylu?


Amfidiusz
 Share

Recommended Posts

Pomimo naszych tłumaczeń, wciąż na forum pojawiają się tematy, w których użytkownicy proszą o wskazanie miejsca, w którym mogą edytować kawałek wyglądu swojego forum. Jako że jest to banalnie prosta operacja, w tym poradniku postaram się ją przybliżyć mniej doświadczonym użytkownikom.

Obecnie każda przeglądarka internetowa jest lub może być wyposażona w szereg narzędzi ułatwiających pracę. Dla Firefoksa jest to wtyczka Firebug, Chrome ma wbudowane Narzędzia dla programistów. Jeżeli używasz mniej popularnej przeglądarki, popytaj na jej supporcie lub zadaj pytanie w tym wątku - inni użytkownicy pomogą.

Niniejszy poradnik będzie bazował na IP.Board 3.1.4 w Google Chrome.




Załóżmy, że chcemy zmienić jedną z linii profilowych w widoku tematu. Niech to będzie tytuł użytkownika:


pre_1306130600__darmowy_czat_po_wygasnie


Wiedząc już, co chcemy zmienić, otwieramy Narzędzia dla programistów:


pre_1306130913__narzedzia1.png


Na dole ekranu otworzy się nowy panel z kompletnym kodem źródłowym strony. Nas interesuje opcja analizy wybranego fragmentu strony:


pre_1306130950__narzedzia2.png


Po wybraniu ikony lupy, wystarczy kliknąć na element, który zamierzamy zmienić:


pre_1306131020__narzedzia3.png


W dolnym panelu wyświetlona zostanie linia HTML odpowiedzialna za wyświetlanie tytułu użytkownika. Po prawej stronie znajduje się kod CSS, który wpływa ma do niej zastosowanie:


pre_1306131140__narzedzia4.png


Wiedząc już, jak wygląda kod linii, należy wybrać element charakterystyczny dla danego fragmentu. Może to być np. tytuł klasy CSS (class="nazwa") lub identyfikator (div id="nazwa"). W przypadku tytułu użytkownika, można wybrać np. klasę linii (li class="title") lub - w związku z tym, że title jest dosyć popularnym elementem każdego stylu - klasę całego diva (div class="author_info").

Następnie przechodzimy do wyszukiwarki stylów w ACP:


pre_1306131406__acp1.png


Gdzie wklepujemy frazę z Narzędzi dla programistów, pamiętając, że IPB operuje na apostrofach, a nie cudzysłowach:


pre_1306131435__acp2.png


Jeżeli wybierzesz dobrą frazę, to będziesz miał tylko jeden wynik wyszukiwania. Dla powyższego zapytania, uzyskałem 4 różne miejsca, w których występuje tytuł użytkownika:


pre_1306131489__acp3.png


W tym wypadku wystarczy odrobina logiki - nie interesuje mnie strona profilowa, bo edytuję widok tematu; nie interesują mnie też ani wyszukiwarka, ani formularz ostrzeżeń. Pozostaje więc userInfoPane. Zmienną można edytować bezpośrednio z poziomu wyszukiwarki, lub (szczególnie jeśli ma to być większa edycja) można przejść do edycji bita stylu.


pre_1306131671__acp4.png


To tyle. Są to naprawdę 3 kliknięcia, które można wykonać w 5 minut. Jeżeli nas o coś pytacie, to postępujemy dokładnie w ten sam sposób. Próbujcie więc znaleźć wybrane elementy w skinie przed założeniem nowego tematu.

Jeśli ktoś ma ochotę, to może zaprezentować screeny z innych przeglądarek smile.gif
  • Like 2
  • Confused 1
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

  • Recently Browsing   0 members

    No registered users viewing this page.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.