O szablonach, ich projektowaniu i moich z tym zmaganiach...
Blog > Komentarze do wpisu

FAQ - edycja ustawień obrazów wstawianych do notki

Maile szablonoweChociaż w mailach się nie powtarzają to jednak wydają się gdzieś wisieć w mojej świadomości jako pytania, które zainteresować mogą większą liczbę osób. Dzisiejsze FAQ nie jest związane z tworzeniem szablonu ale jednemu z pytających tak się wydawało. W swej istocie jednak to pytanie łączy się z edycją wyglądu i cssem czyli nie był wcale na złej drodze ale o tym dokładniej w jednej z następnych notek. Dzisiaj podstawowe pytanie i prosta odpowiedź.

Jeśli mogę prosić, to chciałbym się dowiedzieć, gdzie trzeba podłubać, żeby poprawić wpis z grafiką. W wersji szablonu nad którym pracuję tekst nie "opływa całego obrazka", jedynie pierwszy wers zachodzi na obrazek, co wygląda dość przeciętnie. Zauważyłem, że w nowych szablonach wygląda to już bardziej efektownie, ale nie wiem jak poprawić to u siebie.

Jeżeli mogę liczyć na krótką podpowiedź będę niezmiernie wdzięczny

Jak napisałam już wyżej to nie jest kwestia szablonu, taki efekt możecie uzyskać zarówno w najnowszych szablonach jak i w tych powstałych w początkach istnienia bloksa. Cała sztuczka kryje się w edycji dodawanego zdjęcia. Zakładam, że korzystacie z edytora Tiny MCE (zwykłego zaawansowanego a nie tego z nowymi zdjęciami, w tym drugim nie bardzo można edytować właściwości).

Dodając do notki obraz korzystamy z okna Wklej/edytuj obraz. To jest to miejsce, w którym nadjemy naszej ilustracji tytuł i widzimy jej podgląd. Jest tam kilka kart ale zazwyczaj większość ogranicza się do korzystania tylko z pierwszej a nasza dzisiejsza sztuczka kryje się w drugiej zakładce o nazwie Prezentacja.

Tutaj właśnie możemy wybrać wyrównanie naszego zdjęcia. Aby tekst je opływał powinniśmy zdecydować się na jedną z dwóch ostatnich opcji: Lewy albo Prawy. Wybieramy w ten sposób umiejscowienie naszego zdjęcia: po lewej stronie tekstu albo na prawo od niego.

Więcej o edycji wstawianego do notki obrazu we wpisie: dodawanie obrazu, właściwości 

Ilustrowany przewodnik dla początkujących

czwartek, 28 października 2010, kate_mac

Społecznościowo


Polecane wpisy

TrackBack
TrackBack w tym blogu jest moderowany. TrackBack URL do wpisu:
dodawanie obrazu, właściwości z szablony katemac
Na początek niewielkie wyjaśnienie związane z edytorem. Blox się rozwija i zmiany zachodzą w nim na bieżąco. Mino iż notka nie jest bardzo stara w momencie ponownej edycji, w grudniu 2011 ma nieco ponad rok to nawet w dziedzinie właściwości ... »
Wysłany 2011/12/31 00:10:39
Komentarze
Gość: , *.neoplus.adsl.tpnet.pl
2010/11/27 23:04:58
Witam! Mam do Ciebie pytanie, ponieważ widzę, że ogarniasz temat.;-) Możesz mi pomóc i powiedzieć jak robi się akapit na blox? Tab nie działa... Przepraszam za tak głupie pytanie, ale jestem tu nowa, mam blog od kilku dni.
-
kate_mac
2010/12/03 10:45:20
@Gość: bsk168.neoplus.adsl.tpnet.pl
Pytanie nie jest wcale głupie, to raczej kwestia przyzwyczajeń. Piszesz, że tab nie działa na bloksie ciekawi mnie więc gdzie działa? Gdzie "w internecie" używasz tab jako akapitu.

Tutaj mamy też drugi problem. Zakładam, że pisząc o akapicie tak na prawdę masz na myśli wcięcie w tekście pierwszej linii akapitu a nie sam akapit ale na wszelki wypadek wyjaśnię oczywistą oczywistość także.

Akapit w kodzie html to element umieszczony między znacznikami p (jak paragraf). Jeżeli korzystasz z Tiny MCE to akapit uzyskujesz klikając w enter (chcąc jedynie przejść do następnej linii a nie rozpoczynać nowego akapitu klikasz shift+enter co w stawia w kodzie znacznik br). Jeżeli używasz prostego edytora to aby uzyskać jakiekolwiek formatowanie tekstu musisz użyć znaczników. Treść akapitu ujmujesz w znaczniki {p}Treść akapitu{/p} (użyłam tu nawiasów klamrowych ale w kodzie musisz użyć ostrych). Każdy akapit musi zostać ujęty we własną parę znaczników paragrafu. Tyle o oczywistości.

Zakładam, że skoro chcesz użyć tab do akapitu to zależy Ci na wcięciu w tekście. Tutaj też widzę kilka problemów ;) Na początek jednak gotowe rozwiązanie do CSS:
.BlogWpisTresc p, .WstepKomentowanegoWpisu p, .TrescKomentowanegoWpisu p, #StatycznaZawartosc p {
text-indent:1.5em;
}
Tutaj także użyłam nawiasów klamrowych ale takie mają pozostać. W kodzie html używamy ostrych, w kodzie css klamrowych.

A teraz pora na ale. Wyróżnienie akapitu można osiągnąć na kilka różnych sposobów: mamy wcięcie akapitowe, podcięcie, inicjał, obraz przy wcięciu, wcięcie wiązane, dodatkowe światło itd. Przykładowo często w powieściach nowy rozdział czy podrozdział wyróżniany jest inicjałem. W książkach większość akapitów wyróżniana jest wcięciem akapitowych.

No i problemy z wykorzystaniem takiego wcięcia na blogu. Przy składaniu tekstu akapit wyróżnia się aby odróżnić go od pozostałych elementów. Powyższe rozwiązanie wyróżnia wszystkie akapity czy tego potrzebują czy nie. Nie powinno się w ten sposób wyróżniać pierwszego akapitu bez względu na to czy to pierwszy akapit rozdziału/notki podrozdziału/pierwszy po podtytule. Nie powinno to może zbyt silne słowo, nie potrzeba będzie chyba lepszym.
Drugi problem to fakt iż przeglądarki mają własne rozwiązanie z wyróżnieniem akapitów - stosują dodatkowe światło. Poszczególne paragrafy oddzielone są odstępem (pisząc notkę w edytorze prawdopodobnie tego nie widzisz ale na blogu będzie już widoczne). Aby więc nie dublować wyróżnienia powinnać dodać jeszcze
margin:0px;
do powyższego opisu. Skasuje to dodatkowe światło między akapitami.

I na koniec wielkość takiego odstępu o jaki prosisz. Sprawdziłam w elementarzu i wygląda na to, że minimum to pół firetu, najczęściej używa się wysokość jednego firetu albo jednej interlinii, natomiast wcięcia większe niż trzy firety nie mają sensu. Wpisałam Ci w gotowcu półtorej firetu co często też jest wielkością interlinii (interlinia jest zazwyczaj o 30% większa od wielkości kroju). Nie podałaś mi adresu swojego bloga więc dokładniejszych wartości podać Ci nie mogę. Te tutaj są względne i powinny pasować do każdego szablonu.
Follow Me on Pinterest
Related Posts Plugin for WordPress, Blogger...