Grafika w portalu

Autor: romek data: wt., 2006-03-14 22:34. Drupal

Załączniki

Grafikę można dołączyć do postu jako załącznik. U dołu formularza, w którym dodaje się post, jest grupa pól nazwana "Załączniki" a w niej:

Pole "Dodaj nowy plik" z klawiszem "Przeglądaj"
Klawisz „Dołącz”
Po naciśnięciu "Przeglądaj" wyświetla się dialog "Wysyłanie pliku" oraz foldery i pliki z Twego komputera.
Wybierasz ten, który chcesz wysłać jako załącznik i pstrykasz "Otwórz".
Folder i nazwa pliku pojawią się w polu "Dodaj nowy plik" a wtedy pstrykasz w klawisz "Dołącz"
Chwilę to trwa, a po chwili wysłany plik pojawi się na liście wysłanych załączników. Tej listy na początku nie ma a tworzy się tylko po dodaniu załącznika. Jest szara, nad polem „Dodaj nowy plik”.
Metodą „Przeglądaj” | Dołącz” możesz dodać następny plik itp.
Po skończeniu wykonujesz „Dodaj | Wyslij” na samym dole formularza. Inaczej nic naprawdę w Internecie się nie znajdzie.

Gdzie to jest "fizycznie"?

To była technika, teraz technologia.

Najpierw wszystkie pliki "fizycznie" są na Twoim komputerze
Po dodaniu jako załącznik wysyłane są na serwer do foldera /files/romek/ i od tego momentu tam też są "fizycznie".
Czyli są dwa - jeden u Ciebie, drugi - na serwerze w internecie, ale tylko ten drugi można na stronie zobaczyć.
Załóżmy, że chcesz wysłać "a29.jpg", który masz u siebie na komputerze w "Moje Dokumenty\Moje obrazy\Zdjęcia\a29.jpg".
Po wysłaniu („Przegladaj” | „Dołącz” itp - j.w) znajdzie się on w Internecie. Będzie miał „adres” "http://www.romek.netrom.pl/files/romek/a29.jpg" to jest tzw. URL (ang. Uniform Resource Locator).

Jak to pokazać?

Na razie masz post i załącznik, ale jeszcze nic nie widać. Więc wracamy do tematu - dołaczone do postów (i wysłane na serwer) pliki można wyświetlić na dwa sposoby.

Bezpośrednio: używjąc tagu <img>.
Niestety grafika o szerokości > 500 pikseli - zamieszczona bezpośrednio w tekście - powoduje "wypadanie" strony na prawo. Oczywiście zależy to od rozdzielczości, której używasz i przy większej można tego w ogóle nie zauważyć.
Niestety widziałem nie raz komputery z ekranem rozdzielczości 800x600 (stąd ta tajemnicza liczba "500" - można popróbować, czy nie może być większa) i duże obrazki oraz strona tytułowa, wyglądają wtedy strasznie. Zamieszczając grafikę wystarczy użyć argumentu width=500 w tagu <img> oraz odnośnika do oryginalnego obrazka. Jeśli wpiszesz tu:
<a href="files/romek/a29.jpg"><img src=files/romek/a29.jpg width=300 alt="romek patrzący"></a>(Jak widać nie trzeba podawać całego URL, wystarczy końcówka bez nazwy portalu - ten bowiem fragment URL doda się sam).

otrzymasz zdjęcie o szerokości 300 pikseli z odnośnikiem do orygnału (zadziała na pstrykniecie w zdjęcie) oraz "dymkiem" z opisem. Niestety nie wygląda to zbyt ładnie.
Jako "opływana" miniaturka: używając filtra [inline:xx] (01 oznacza pierwszy dołączony plik, 02 - drugi itd).

Piszesz:

[inline:01]Spowoduje umieszczeniew w tekście miniaturki dołaczonej grafiki "opływanej" tekstem.

Widać:

Spowoduje umieszczeniew w tekście miniaturki dołaczonej grafiki "opływanej" tekstem.

Taka miniaturka nie ma jednak odnośnika a jeśli obrazek jest duży, to byłoby dobrze, gdyby jego miniaturka dała się powiększyć. Do tego używasz tagu <a href="...."></a> tworząc odnośnik.

Piszesz:

<a href="files/romek/Pankiewicz_Woz_z_sianem_0.jpg">[inline:01=Pankiewicz - Wóz z sianem]</a>Otrzymamy rysunek z odnośnikiem i dymkiem (to tekst po znaku= wewnątrz [inline:...]). To "prawie" idał, ale ...

Widać

Otrzymamy rysunek z odnośnikiem i dymkiem (to tekst po znaku= wewnątrz [inline:...]). To "prawie" idał, ale ...

Skok pod rysunek

Tekst opływa rysunek, ale gdybyś chciał zacząć nowy paragraf "pod rysunkiem" masz kłopot. Wtedy - do wymuszenia nowej lini - używasz tagu <br> z argumentem clear="all":

i ... jeśli tu wstawię kod ...<br clear="all">...
hops, skoczę pod rysunek, tzn. w tym miejscu wyświetlony zostanie tekst napisamy po <br clear="all">. Fajne nie?