ddumi WeBlog

Acest script il dedic unui colaborator care m-a rugat sa ii fac o galerie de poze simpla. Am facut doar “prima pagina”.. acolo unde apar toate pozele. Daca nu este de ajuns sa imi zici ca iti fac si script PHP care sa returneze numele pozelor dintr-o baza de date sau dintr-un folder.

DEMO (asa arata galeria/albumul de poze)

Download (arhiva .rar)

Sugestii sau pareri in comentarii.

Pentru ca ne place sa ne jucam cu pozele si sa le editam pana arata asa cum dorim, azi va explic cum sa colorati o poza alb-negru (din asa in asa):

1. Deschidem poza in Photoshop (CTRL+O)

2. Adaugam un nou layer deasupra layer’ului background (Shift+CTRL+N) (vezi poza)

3. Setam ca Blending Mode - Overlay (vezi poza)

4. Selectam Brush Tool si de la Brush Preset picker modificam Hardness la 100% ( vezi poza)

5. Alegem culoarea rosu si ne apucam de colorat inima de plus inzestrati cu o rabdare de otel (ai grija sa nu colorezi si alte zone) (vezi poza)

6. Dupa ce am terminat de colorat salvam poza si am terminat (Shift+CTRL+S).

Pentru utilizatorii platformei Blogger, voi descrie pas cu pas cum se poate elimina bara de navigare situata in headerul paginii. De ce vrem sa eliminam bara de navigare? pentru ca arata mai bine blog’ul fara ea si pentru a ne tine vizitatorii cat mai mult pe pagina.

Incepem?

Ne autentificam pe contul nostru, dam click pe tabul Sablon apoi pe Editati HTML. De retinut: inainte sa faceti modificari sa va salvati scriptul intr’un fisier text, daca gresiti undeva sa puteti sa va “repuneti blogul inapoi pe picioare”.. adica sa arate exact ca inainte. Apoi in chenarul Editati sablon dam de scroll in jos pana ajungem undeva unde scrie ceva de genul asta si noi vom modifica codul CSS care va arata asa. Deci ati retinut nu? din asa in asa. Apasam pe butonul Salvati sablon si acum intram pe blog sa vedem cum arata fara bara de navigare. Simplu ca buna ziua nu? Cum functioneaza? in codul CSS ii “spunem” browser’ului ca acea bara nu trebuie afisata, ea este inca in pagina dar browser’ul nu o mai afiseaza.

Intrebari?

Ca webmaster de multe ori ai nevoie de un sistem de vot pentru diferite rubrici din website, asa ca m’am gandit ca nu strica sa postez un script de vot simplu si usor de editat in functie de nevoi.

Asa arata scriptul in actiune (demo), codul sursa HTML, CSS si PHP.

Folosim doar o imagine .png de 30×60 pixeli, in prima jumatate va fi o stea simpla iar in a doua jumatate a pozei va fi o steluta colorata. Nu intru in detalii precum de cate ori are voie un IP sa voteze intr’o singura zi sau cum sa faceti update la o tabela cu voturi.

Intrebari?

Zilele astea m’am tot gandit ce mai trebuie modificat pe la subdomeniile mele si scripturile puse pe ele. Si mi’am adus aminte de acele “butoane” cu Next si Prev de la scriptul lightbox si m’am gandit putin si mi’am zis ca nu ar strica sa incerc sa fac ceva asemanator fara sa ma uit in codul sursa de la acel script, doar cu php si css. M’am pus pe munca si a iesit aproximativ 99% asa cum vroiam.

Scriptul arata asa (demo cu 3 poze de diferite marimi), codul sursa PHP si style.css

PS: am facut un mic artificiu cu cele 3 poze si ordinea lor la afisare ca sa nu mai folosesc o baza de date sau un fisier .txt

Intrebari?

Urasc incompatibilitatea asta intre standardele folosite de diferite browsere si faptul ca esti nevoit sa modifici codul CSS al unei pagini ca sa fie compatibila si sa arate la fel pe toate browserele, ma refer alea care sunt cele mai des utilizate (Mozilla Firefox, Opera, Internet Explorer). La o pagina a trebuit sa folosesc un div semi-transparent si eu fiind unutilizator la browserului Mozilla Firefox am folosit -moz-opacity:0.5 dar am primit plangeri de la cateva persoane care foloseau alt browser ca div’ul nu este transparent. Dupa cateva cautari pe google am gasit o “lista” care ii dadea div’ului semi-transparenta si pentru celelalte browsere.

Lista este aici si este “setata” la jumatatea scalei de transparenta. Sper sa va fie de folos daca veti avea vreodata nevoie ;)

Lucrand la cate un script, la un moment dat aveam nevoie de un chenar in care sa afisez o eroare sau sa atentionez userul ca urmeaza o sectiune importanta ce trebuie tratata ca atare. De inceput ma multumeam cu un div simplu unde eroarea sau informatia era scrisa boldat si cu rosu. Totusi am vazut pe multe website’uri chenare frumos colorate, si mi’am zis ca e cazul sa folosesc si eu asa ceva.

Scriptul in functiune arata asa, iar codul sursa il gasiti aici si aici.

Cele 4 iconuri se pot procura usor dintr’un pack cu iconuri, e plin internetul de ele.

Intrebari?