Tutoriale Wordpress

NextGen Gallery împreună cu PrettyPhoto

NextGen Gallery este unul din cele mai utilizate pluginuri WordPress pentru galerii foto. Este simplu de folosit, are multe funcționalități, se integrează ușor în teme dezvoltate, gratuite sau comerciale.

PrettyPhoto este o clonă a jQuery lightbox o minunăție de cod ce permite afișarea imaginilor dintr-o galerie foto într-un mod elegant, mai elegant decât o face NextGen Gallery. De fapt dacă inserezi js-ul de pretty photo toate imagnile din site se deschid frumos și cele de pe acceași pagină formează o galerie foto. În fine, PrettyPhoto poate veni inclus în diverse teme comerciale ceea ce face dificilă instalarea și folosirea pluginului nextgen gallery.

NextGen Gallery permite setarea efectului prin carte se deschide o imagine la click pe un thumbnail din galerie: Options -> Effects. Implicit este setat efectul Shutter care arată ca mai jos:

nextgen-gallery-cu-prettyphoto-1

Efectul își face treaba, însă nu prea aspectuos, nu?

Aceeași poză deschisă cu PrettyPhoto:

nextgen-gallery-cu-prettyphoto-2

Arată mai bine, afișează pozele din galerie în partea de jos a imaginii mari, are butoane de share. Foarte frumos.

Pentru a avea acest efect trebuie urmați pașii:

  1. download script de pe site-ul no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/
  2. instalare conform documentației
  3. instalare pluginului NextGen Gallery
  4. din Options -> Effects selectezi varianta Custom și copiezi codul de mai jos (seamnă cu cel de la lightbox)
rel="prettyPhoto[%GALLERY_NAME%]"

Și gata. Simplu și frumos.

nextgen-gallery-cu-prettyphoto-4

Tags: ,

7 Comentarii

  1. salut

    imi poti descrie te rog cum l-ai instalat?
    ms

  2. Salut. Multumesc de vizita si de intrebare.

    Instalarea PrettyPhoto se face asa:

    1. download pachet: http://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/

    2. dezarvivezi local

    3. copiezi jquery.prettyPhoto.js in directorul js din tema ta sau in alt loc in care sunt fisierele de JavaScript

    4. copiezi fisierul prettyPhoto.css in directorul css sau styles sau unde sunt tinute fisierele css, daca nu exisat un director anume poti sa-l copiezi direct in tema

    5. copiezi directorul images/prettyPhoto in directorul images din tema – atentie doar directorul prettyPhoto nu si restul (restul sunt imagini demosntrative)

    Acum trebuie sa incluzi fisierul de js si fisierul de css in header.php. Inainte de asta, ca am uitat, verifica in header.php daca incluzi cumva fisierul jquery.js (varianta mare sau minimizata, nu conteaza). Daca nu este inclus copiaza in js in acelasi loc cu jquery.prettyPhoto.js si fisierul jquery-1.6.1.min.js

    1. deschizi fisierul header.php si in zona in care sunt incluse fisierele js si css adaugi urmatoarele trei linii

    /js/jquery.prettyPhoto.js" type="text/javascript" charset="utf-8">

    Prima linie doar daca nu ai deja inclus fisierul jquery.js!

    Modifica caile catre fisiere asa cum iti trebuie.

    2. in footer.php inainte de a se inchide body adauga urmatorul cod care initializeaza prettyphoto.

    3. nu uita sa modifici la optiuni -> effects -> rel=”prettyPhoto[%GALLERY_NAME%]”

    Practic orice poza se poate deschide folosind PrettyPhoto daca la url adaugi: “rel=”prettyPhoto”

  3. Super explicatii! Merci frumos. Am si eu o intrebare: poti cumpla PrettyPhoto cu galeria implicita de pe wordpress 3 ?

  4. Pingback: Site turistic dezvoltat pe wordpress, site de calatorii

  5. Pingback: PrettyPhoto împreună cu galeria foto WordPress

  6. Pingback: Instalarea codului PrettyPhoto

Scrie un comentariu sau pune o intrebare

Your email address will not be published. Required fields are marked *

*