SKRÓTY KLAWISZOWE
ctr + F - wyszukaj na stronie.
ctr + +/- - powiększ/pomniejsz widok strony
ctr + shift + V - wklejenie tekstu bez formatowania (przydatne w edycji posta)
WCIĘCIE NA POCZĄTKU AKAPITU
Wzór kodu:
<div style="text-indent:4%;">
Akapit twojego tekstu.
</div>
Zmienną kodu jest liczba (określa głębokość wcięcia). Niestety komendę tą trzeba powtarzać co akapit. Zamknięcie jej (</div>) na końcu całego posta nie spowoduje zmiany wszystkich znajdujących się w nim akapitów. Jak wygląda efekt:
Tak wygląda. Tak wygląda. Tak wygląda.Tak wygląda. Tak wygląda. Tak wygląda. Tak wygląda. Tak wygląda. Tak wygląda. Tak wygląda. Tak wygląda. Tak wygląda. Tak wygląda. Tak wygląda. Tak wygląda.
ZMIANA CZCIONKI
Do szablonu wgrane są ozdobne czcionki, które można wykorzystać w wybranych akapitach tekstu:
1) Pirata One
2) Sancreek
3) Vladimir Script
Wzór kodu:
<span style="font-family: 'nazwa czcionki 1, 2 lub 3', cursive;">
Twój tekst
</span>
W kodzie zmienną jest pełna nazwa czcionki (Pirata One/Sancreek/Vladimir Script) znajdująca się w miejscu oznaczonym zieloną czcionką.
INDEKS GÓRNY
W widoku HTML posta prze wybraną cyfrą (np. 7) należy wstawić ten oto kod:
<sup> 7 </sup>
Efekt:
Przypis 7
LISTWA - ODTWARZACZ MUZYKI
Przykładowy wygląd:
<iframe width="560" height="30" src="https://www.youtube.com/embed/pdd9b47x67M?rel=0&showinfo=0" frameborder="0" allowfullscreen></iframe>
Jak wstawić?
- Otwórz wideo za pomocą youtube.
- Naciśnij przycisk 'Udostępnij', a potem 'Umieść'. Zaznacz tylko te opcje, które uważasz za przydatne. Skopiuj wyświetlony kod html.
- Otwórz edytora postów zmień przycisk z 'Nowy post' na 'HTML'. Odnajdź miejsce w tekście, w którym chciałbyś wkleić listwę.
- Zmień wartość "height"na "30". Wyznacza ona wysokość odtwarzacza. Bez tej zmiany w poście pojawi się całe wideo.
- Wróć do edycji tekstu sformatowanego, klikając "Nowy post". Odtwarzacz powinien pojawić się w tekście. Można go wyrównywać i przemieszczać analogicznie do obrazów.
SPIS TREŚCI
<a href="link do posta#Naglowek1"> Nagłówek 1 </a>
- kod nagłówka znajdującego się w spisie treści
<h1 id="Naglowek1"> Nagłówek 1 </h1>
- kod w miejscu, do którego miał odesłać spis treści.
Zaznaczone na niebiesko elementy muszą być identyczne, ponadto - nie mogą się powtarzać w różnych punktach spisu, bo wówczas nie zadziałają. Zielony tekst to wykorzystane przez nas nagłówki, np.
Edycja szablonu.
MULTITAB, CZYLI KLIKACZE
[...]
AKTUALNIE
Uwaga! Nie zmieniamy z edycji HTML na edycję tekstu sformatowanego, bo wszystko diabli wezmą.
<div class="quotes">
<div class="quote-dots"></div>
<div class="quote-contain">
<div class="quote-rotate">
<p>
treść 1 </p>
</div>
<div class="quote-rotate">
<p>
treść 2 </p>
</div>
</div>
</div>
EDYTOWANIE SPISU OPOWIADAŃ, MISJI I SPISU KODÓW
Pierwsze są misje i tak jak spis opowiadań to po prostu okienko po kliknięciu. Dawniej efekt ten był wykorzystywany przy starych Misjach.
<div id="content-3" class="content">
<div class="rzym-licz">I. Tytuł misji</div>
Treść misji
<br/><br/>
<div class="rzym-licz">II. Tytuł misji </div>
Treść misji
<br/><br/>
</div>
POSTACIE
Kolejne taby z linkami.
Link wygląda tak:
<a href="adres" class="km"><span>numer postaci</span> nazwa postaci</a>
Urlopy - znak minus:
<i class="fa fa-minus-square-o"></i> Data
ROTATOR TEKSTU LUB BANNERÓW
Kod na ramkę, której zawartość - tekst lub obraz - są przewijane góra/dół, znikając poza granicami. Pozwala oszczędzić miejsca w kolumnie z gadżetami.
Align to wyrównanie w linii, direction to kierunek ruchu, heigh - wysokość ramki, scrollamount - prędkość przewijania, width - szerokość.
<marquee align="center" direction="up" height="120" scrollamount="3" width="100%">
Nasz ruchomy tekst
lub
<a href="tu adres linku" target="”new”"><img src="tu bezpośredni adres obrazka" /></a><br />
<a href="tu adres linku2" target="”new”"><img src="tu bezpośredni adres obrazka2" /></a><br />
</marquee>
TEKST ZMIENIAJĄCY SIĘ PO NAJECHANIU KURSOREM
Kod dodaje się w gadżecie HTML/JavaScript. Jak on wygląda:
Kod efektu:
<a class='navi' href='adres otwieranego przez nas linku'>
<div style="text-align:center;"
onmouseover="this.innerHTML='Widzisz różnicę?';"
onmouseout="this.innerHTML='Najedź na mnie kursorem';"
>
Najedź na mnie kursorem
</div></a>
Onmouseover - efekt po najechaniu na link,
onmouseout to efekt - powrót do normalności - podczas, gdy myszka nie "dotyka" już linku.
Text-align:center to wyrównanie w linii, np.
wypośrodkowanie.
SZEROKA LISTA
<form><select style="width: 400px" onchange="window.open(this.options[this.selectedIndex].value,'_self')"
size=1 name=menu>
<option />Nagłówek widoczny przed wysunięciem listy
<option value="link1" />Tytuł pozycji 1
<option value="link2" />Tytuł pozycji 2
</select></form>
***
Zakładka złożona z kodów znalezionych i opracowanych przez Szept, Rinne oraz Zoranę.
Wszystkie pytania proszę zgłaszać za pomocą chatu (pilne) lub komentarzy (uwagi i pytania, które mogą zaczekać).
KODY,
Nefryt,
Zorana
Brak komentarzy:
Prześlij komentarz