PHP+JQUERY+MYSQL no2- Photo Gallery

Μια περιοχή όπου τα μέλη μας μπορούν να βάζουν τα PHP scripts που έχουν φτιάξει και θέλουν να τα μοιραστούν με τα υπόλοιπα μέλη.

Συντονιστές: Super-Moderators, WebDev Moderators, PHP Moderators

Απάντηση
Άβαταρ μέλους
fafos
Script Master
Δημοσιεύσεις: 6227
Εγγραφή: 30 Νοέμ 2004 03:09

PHP+JQUERY+MYSQL no2- Photo Gallery

Δημοσίευση από fafos » 05 Φεβ 2010 00:21

Με αυτόν τον οδηγό θα δούμε πως μπορούμε να φτιάξουμε μία (σχετικά) απλή photo gallery με php, mysql και αρκετή jquery...

Πριν προχωρήσω στην περιγραφή και τις οδηγίες διαβάστε τα παρακάτω:

1. Η διαχείριση (admin) ΔΕΝ είναι προστατευμένη! πρέπει να βρείτε τον τρόπο να την ασφαλίσετε!

2. Προσπάθησα να χρησιμοποιήσω όσο πιο απλό layout γίνεται για να καταλάβουν και αυτοί που δεν έχουν πολλές γνώσεις τι έχω κάνει στον κώδικα.

3. Έχω χρησιμοποιήσει πολλά jquery scripts και όποια ανήκουν σε άλλους έχω αφήσει τα σχόλια στα αρχεία ή θα τους αναφέρω παρακάτω. Διαβάστε τις άδειες χρήσης για το καθένα!

4. Η gallery δουλεύει μόνο αρχεία jpg!

5. Όλα τα αρχεία και η βάση δεδομένων είναι σε UTF-8!!



DEMOS:

Διαχείριση: http://www.istopoli.com/tuts/gallery/admin/ (δεν μπορείτε να ανεβάσετε φωτογραφίες ή να καταχωρήσετε κάτι στην βάση, είναι απλώς για προεπισκόπιση)

Η Gallery: http://www.istopoli.com/tuts/gallery/



Περιγραφή - Δυνατότητες:


Η gallery είναι πιο πολύ για να δούμε πως δουλεύει η php, mysql με την jquery και έχει τα παρακάτω χαρακτηριστικά:

ΔΙΑΧΕΙΡΙΣΗ:

1. Δημιουργία κατηγοριών και ταξινόμηση αυτών για το μενού μας ( http://www.istopoli.com/tuts/gallery/ad ... -short.php )
Οι έχοντες γνώσεις μπορούν να δημιουργήσουν κατηγορίες και υποκατηγορίες. Οι κατηγορίες μπορούν να επεξεργαστούν με ajax way ( http://www.istopoli.com/tuts/gallery/admin/cat-edit.php )

2. Σελίδα ρυθμίσεων φωτογραφιών, watermark κλπ.

3. Ανέβασμα φωτογραφιών (σε jpg μορφή) και σώσιμο σε 3 μεγέθη (κανονική, μεσαία και μικρογραφία). Η κανονική και η μεσαία φωτογραφία παίρνουν ένα watermark σε όποια γωνία της φωτογραφίας ορίσουμε ή και στην μέση μέσα από τις ρυθμίσεις.

4. Πληροφορίες φωτογραφίας, όπως τίτλος περιγραφή κλπ.

5. Extra τεχνικές πληροφορίες με το Exif της PHP. Με αυτήν την βιβλιοθήκη μπορούμε να πάρουμε τεχνικές πληροφορίες από την φωτογραφία που ανεβάζουμε όπως διαστάσεις, μάρκα μηχανής, πότε τραβήχτηκε κλπ. Περισσότερα για την exif μπορείτε να διαβάσετε εδώ: http://php.net/manual/en/book.exif.php
Αν δεν υποστηρίζει ο server σας αυτήν την βιβλιοθήκη ή αν δεν επιθυμείτε να δίνετε αυτές τις πληροφορίες απλώς επιλέξτε "ΟΧΙ" στις ρυθμίσεις.

Όλες τις φωτογραφίες μπορείτε να τις επεξεργαστείτε είτε να αλλάξετε τις μικρογραφίες ή να την διαγράψετε.


Η GALLERY:

1. Σελιδοποίηση όλων των φωτογραφιών και αναζήτηση με κατηγορία ή λέξεις στον τίτλο, την περιγραφή ή τα keywords.

2. Σελίδα για κάθε φωτογραφία με όλες τις πληροφορίες της. Πατώντας την φωτογραφία εμφανίζεται σε κανονικό μέγεθος με ajax φυσικά :lol:



Εγκατάσταση:



1. Κατεβάστε το αρχείο gallery.zip από το link που δίνω στο τέλος της σελίδας και αποσυμπιέστε το.

2. Ανοίξτε το αρχείο gallery/config-gallery.php και αλλάξτε τα στοιχεία της βάσης σας και το url της ιστοσελίδας σας προς την gallery. Ανεβάστε όλα τα αρχεία στην ιστοσελίδα σας εκτός του αρχείου vash-dedomenon.txt

4. Δώστε CHMOD 777 στους φακέλλους:

images/
images/middle/
images/normal/
images/thumbs/

3. Δημιουργήστε με το phpmyadmin μία νέα βάση δεδομένον (π.χ. gallery). Ανοίξτε το αρχείο vash-dedomenon.txt και καταχωρήστε τα στην νέα βάση σας.

Η gallery είναι έτοιμη. Ανοίξτε την διαχείριση, επιλέξτε τις ρυθμίσεις και κάντε τις αλλαγές σας.

στον φάκελλο gallery/images/ μπορείτε να ανεβάσετε το δικό σας watermark. Προτείνω, η εικόνα να είναι μορφής .png 24 ή 32 bit με διαφανές (transparent) φόντο.

Μέσα στα αρχεία έχω διάφορα σχόλια για το τι κάνει το καθένα κομμάτι κώδικα εκεί μέσα. Επίσης έχω χωρίσει σε πολλά μέρη τον κώδικα και τα κάνω include για πιο εύκολο διάβασμα. Τις προσεχείς ημέρες θα ανεβάσω και κάποια plugins για την gallery.

ΜΗΝ ξεχάσετε να ασφαλίσετε τον φάκελλο admin πριν την δώσετε στον αέρα!!




ΤΑ ΑΡΧΕΙΑ:

http://www.istopoli.com/tuts/gallery/gallery.zip


Σημείωση.. Η βάση δεδομένων είναι άδεια από φωτογραφίες και κατηγορίες. Πρέπει να δημιουργήσετε πρώτα τις κατηγορίες και μετά να αρχίζετε να ανεβάζετε φωτογραφίες!

Άβαταρ μέλους
fafos
Script Master
Δημοσιεύσεις: 6227
Εγγραφή: 30 Νοέμ 2004 03:09

PHP+JQUERY+MYSQL no2- Photo Gallery

Δημοσίευση από fafos » 05 Φεβ 2010 03:16

Προστέθηκε το 1ο plugin:



Like Youtube Photoscroller: http://www.istopoli.com/tuts/gallery/photoscroller/

Άβαταρ μέλους
dimsis
Reporter
Δημοσιεύσεις: 7994
Εγγραφή: 25 Ιούλ 2001 03:00

PHP+JQUERY+MYSQL no2- Photo Gallery

Δημοσίευση από dimsis » 05 Φεβ 2010 09:10

Ωραίος fafos, ευχαριστούμε που το μοιράζεσαι.

Έβαλες και edit in place στις κατηγορίες είδα στο backend, fancybox και carousel στο frontend.
Στην αναζήτηση που δοκίμαζα search για "ουκρ" είτε στον τίτλο είτε παντού δεν γύριζε αποτελέσματα. Ψάχνεις να κάνεις match ολόκληρη λέξη; Αν γράψω "Ουκρανέζικο" βλέπω γυρίζει...

http://www.istopoli.com/tuts/gallery/ad ... .php?id=30
lol για το Ουκρανέζικο αξιοθέατο

Άβαταρ μέλους
stevebat
Script Master
Δημοσιεύσεις: 307
Εγγραφή: 05 Αύγ 2009 15:54
Επικοινωνία:

PHP+JQUERY+MYSQL no2- Photo Gallery

Δημοσίευση από stevebat » 05 Φεβ 2010 13:02

πω πω πολύ όμορφο σε ευχαριστούμε πολύ

Άβαταρ μέλους
fafos
Script Master
Δημοσιεύσεις: 6227
Εγγραφή: 30 Νοέμ 2004 03:09

PHP+JQUERY+MYSQL no2- Photo Gallery

Δημοσίευση από fafos » 05 Φεβ 2010 16:18

dimsis έγραψε:Ωραίος fafos, ευχαριστούμε που το μοιράζεσαι.

Έβαλες και edit in place στις κατηγορίες είδα στο backend, fancybox και carousel στο frontend.
Στην αναζήτηση που δοκίμαζα search για "ουκρ" είτε στον τίτλο είτε παντού δεν γύριζε αποτελέσματα. Ψάχνεις να κάνεις match ολόκληρη λέξη; Αν γράψω "Ουκρανέζικο" βλέπω γυρίζει...

http://www.istopoli.com/tuts/gallery/ad ... .php?id=30
lol για το Ουκρανέζικο αξιοθέατο
Thanks..

ta jquery pou xrhsimopoio tha ta anafero siga siga giati den thymamai kiolas poia exo xrhsimopoihsei.. :lol:

H anazhthsh douleuei me FULLTEXT opote psaxno gia oloklhres lekseis gia na apofygo ta mhdenika apotelesmata otan kapoios dosei 2 h perissoteres lekseis kai den einai sthn idia seira opos exoun kataxorhthei... gia paradeigma, an grapseis αξιοθέατο Ουκρανία tha sou dosei apotelesmata se antithesi me to LIKE pou den gyrna tipota.. vevea ksexasa na valo to relevance gia na gyrna prota ta pio sxetika apotelesmata alla tha mperdepsoume ton kosmo etsi..

Άβαταρ μέλους
vassilism
Δημοσιεύσεις: 1950
Εγγραφή: 17 Μαρ 2007 14:47
Επικοινωνία:

PHP+JQUERY+MYSQL no2- Photo Gallery

Δημοσίευση από vassilism » 05 Φεβ 2010 16:33

Πατρίδα, μεγάλε δάσκαλε μας μάγεψες πάλι :clap: :respect:

Άβαταρ μέλους
fafos
Script Master
Δημοσιεύσεις: 6227
Εγγραφή: 30 Νοέμ 2004 03:09

PHP+JQUERY+MYSQL no2- Photo Gallery

Δημοσίευση από fafos » 05 Φεβ 2010 16:41

Ena mikro update..

evala Autocomplete sthn forma anazhthshs.. otan arxizeis kai grafeis kapoia leksh anazhthshs, enmfanizei apo kato se lista pithanous titlous fotografion pou yparxoyn sthn vash mas..

Ean exete katevasei hdh thn gallery parakato episynapto ta arxeia pou prostethikan h allaksan...

Aplos anevaste ta sthn galery...

thanks patrida.... :lol:
Συνημμένα
gallery_update_1.zip
Update 1
(24.21 KiB) Μεταφορτώθηκε 800 φορές

Άβαταρ μέλους
fafos
Script Master
Δημοσιεύσεις: 6227
Εγγραφή: 30 Νοέμ 2004 03:09

PHP+JQUERY+MYSQL no2- Photo Gallery

Δημοσίευση από fafos » 05 Φεβ 2010 20:51

Ena akomh plugin: Feature List (jquery)

einai ena slide show ton proton 4 photografion..

demo: http://www.istopoli.com/tuts/gallery/galleryview.php

arxeia: http://www.istopoli.com/tuts/gallery/featurelist.zip


aplos aposympieste to arxeio kai anevaste sthn gallery ta arxeia pou einai mesa ston fakello featurelist (oxi ton fakello featurelist!)

Άβαταρ μέλους
Basilakis
PHP Moderator
Δημοσιεύσεις: 8574
Εγγραφή: 17 Νοέμ 2003 13:03
Τοποθεσία: Womans' Brain
Επικοινωνία:

PHP+JQUERY+MYSQL no2- Photo Gallery

Δημοσίευση από Basilakis » 06 Φεβ 2010 17:32

Μπράβο man, εξεραιτεκό! :D

Άβαταρ μέλους
telas
Honorary Member
Δημοσιεύσεις: 1594
Εγγραφή: 12 Μαρ 2004 12:54
Τοποθεσία: Kastoria
Επικοινωνία:

PHP+JQUERY+MYSQL no2- Photo Gallery

Δημοσίευση από telas » 06 Φεβ 2010 18:05

Σκάβει, δέρνει και σπέρνει τον πανικό! Πολύ ωραία υλοποίηση.
Ευχαριστούμε!
Web Design - Δημιουργία Ιστοσελίδας - http://www.computerman.gr/
My Photography - http://www.tilaveridis.com/
Τεχνολογικά προιόντα - http://www.bigbox.gr/

Άβαταρ μέλους
fafos
Script Master
Δημοσιεύσεις: 6227
Εγγραφή: 30 Νοέμ 2004 03:09

PHP+JQUERY+MYSQL no2- Photo Gallery

Δημοσίευση από fafos » 06 Φεβ 2010 18:44

Ksexasa na anafero oti to script einai kato apo to license: GhG+10M

Άβαταρ μέλους
fafos
Script Master
Δημοσιεύσεις: 6227
Εγγραφή: 30 Νοέμ 2004 03:09

PHP+JQUERY+MYSQL no2- Photo Gallery

Δημοσίευση από fafos » 07 Φεβ 2010 23:29

Update no 2 - Βαθμολογία Φωτογραφιών


Πρόσθεσα την δυνατότητα να μπορούν οι χρήστες να ψηφίζουν την κάθε φωτογραφία..

Χρησιμοποίησα το script από εδώ: http://www.codingcereal.com/2009/11/jqu ... -ajax-php/
αλλά το έχω παραμετροποιήσει αρκετά :lol:

Η βαθμολογία αποθηκεύει την ip και βάζει και ένα cookie στο pc του χρήστη για να μην μπορεί να ξαναψηφίσει την ίδια φωτογραφία..

Δέχεται ψήφους από 1 έως 5, εσείς μπορείτε να αλλάξετε (π.χ. 1 έως 10) εφόσον γνωρίζετε λίγο κώδικα...

Αν έχετε εγκαταστήσει ήδη την gallery, κατεβάστε το zip αρχείο που επισυνάπτω, αποσυμπιέστε το και διαβάστε τις οδηγίες στο odhgies.txt..
Συνημμένα
gallery_update_2.zip
Update 2
(7.63 KiB) Μεταφορτώθηκε 742 φορές

Άβαταρ μέλους
dimsis
Reporter
Δημοσιεύσεις: 7994
Εγγραφή: 25 Ιούλ 2001 03:00

PHP+JQUERY+MYSQL no2- Photo Gallery

Δημοσίευση από dimsis » 07 Φεβ 2010 23:48

Με λίγα λόγια ο fafos έχει δώσει έτοιμο php κώδικα για να μπορέσετε να χρησιμοποιήσετε δυναμικά στην εφαρμογή σας όλα αυτά τα ωραία jquery scripts...
Μπραβο fafo Άρχοντα των scripts! Άντε να δούμε θα τα χρησιμοποιήσει κανείς ή θα σε ρωτάνε πως να τα βάλουν στο joomla :)

Άβαταρ μέλους
fafos
Script Master
Δημοσιεύσεις: 6227
Εγγραφή: 30 Νοέμ 2004 03:09

PHP+JQUERY+MYSQL no2- Photo Gallery

Δημοσίευση από fafos » 07 Φεβ 2010 23:53

dimsis έγραψε:Με λίγα λόγια ο fafos έχει δώσει έτοιμο php κώδικα για να μπορέσετε να χρησιμοποιήσετε δυναμικά στην εφαρμογή σας όλα αυτά τα ωραία jquery scripts...
Μπραβο fafo Άρχοντα των scripts! Άντε να δούμε θα τα χρησιμοποιήσει κανείς ή θα σε ρωτάνε πως να τα βάλουν στο joomla :)
Vasika den to efeiaksa san gallery efarmogh mono.. to efeiaksa gia na doun pos douleoun ta jqueroeidh me thn php kai thn mysql.. an ta apomonosoun mporoun na ta valoun se oti efarmogh theloun opos gia paradeigma to teleutaio update opou einai etoimo na to xrhsimopoihseis opou thes (se arthra p.x.)..

To joomla einai san ton Jack Norris.. prin ta skeftoume emeis ta exei egkatsthsei auta ta mpixlimpidia.. :lol:

zeppos
Δημοσιεύσεις: 431
Εγγραφή: 26 Μαρ 2006 10:43
Τοποθεσία: Kyklades
Επικοινωνία:

PHP+JQUERY+MYSQL no2- Photo Gallery

Δημοσίευση από zeppos » 10 Φεβ 2010 11:39

ΠΟΛΥ ΚΑΛΟ και χρήσιμο fafos. Ευχαριστώ πολύ..
Ακόμη βέβαια "παιδεύομαι" να το στρώσω τοπικά.
Εχω τον WAMP5 και περιέργως δεν εκτελεί όσες php εντολές αρχίζουν μόνο με ? και χωρίς το php να ακολουθεί. Ανοίγω ένα-ένα τα αρχεία και το προσθέτω παντού γιατί είναι πολλά και διάσπαρτες οι μικροεντολές php στα αρχεία.
Επίσης με το photoscroller .. λίγο ψιλομπέρδεμα.
Θα στρώσει!
Εικόνα

Απάντηση

Επιστροφή στο “PHP τα δικά μας scripts”

Μέλη σε σύνδεση

Μέλη σε αυτήν τη Δ. Συζήτηση: Δεν υπάρχουν εγγεγραμμένα μέλη και 0 επισκέπτες