Jquery + surukle birak - Resim yukleme scripti - Piclect API v6.0.1

Uzun zamandir bitirmek icin ugrastigim piclect.com bitti ve sira gelmisti API scriptine 4 gun dolu dolu bunu bitirmeye calisiyordum. O gun sukurler olsun geldi ve ortaya cok memnun oldugum seyler cikti.

NOT: Resimler otomatik olarak piclect.com sunucularina yuklenir ve sizin sitenizden herhangi bir trafik yada alan isgali olmaz. Hosta yuk bindirmez. Bu isi zahmetsiz yapmak isteyenlere ve kolay yoldan para kazanmak isteyenlere hitaben bu projeyi yurutmekteyim..

Demo site: Ressim.net

Download: Piclect_API v6.0.1 versiyonunu indir.

Not: bu konu sistemin guncellenmesi ve kurulmasi dahil herseyi iceren tek bir konu olacak. Boylece o nasildi, bu nasildi diye farkli konulara bakmak zorunda kalmayacaksiniz.



P_API v6.0.1 versiyonunda ne gibi degisiklikler yapildi, neler eklendi, farki nedir eski versiyonlardan?

• En onemli degisiklik, upload alaninin degismis olmasidir.
• Ayni anda 20 resim upload edebileceksiniz.
• Resimleri toplu secebilir yada surukle *birak ile upload alanina birakabilirsiniz.
• Upload alanini sade tasarladim. Resim sectikten sonra extra upload alani altda acilmakta.
• Koleksiyon kismi artik piclect.com daki hesabinizda bulunan kategoriler ile olusturulur. Bunun icin adminden koleksiyonlarinizi guncellemeniz yeterli. Otomatik olarak kendi databasenize eklenir ve sitede listelenir.
• Yeniden resimleri boyutlandirdiginizda orjinal resim ayni sekilde yuklenir, ayri olarak yeni boyut ilede linklerinizi alabilir ve kullanabilirsiniz.
• Index adminden acabileceginiz ikinci bir alan mevcut. Bu alanda son yuklenen resimler ve adminden sitede gosterilmesini istediginiz koleksiyonlar listelenir. Ayrica reklam alanlarida ayri olarak mevcut. Bunlarin hepsini admin sayfanizdan duzenleyebilirsiniz. buna ornek resimleride asagida yayinlayacagim zaten.
• Resimleri listelerken 84px olanini sectim. Boylece sayfanin yuklenmesi daha hizli oluyor ve buyut farkliligindan dogan sorunlardan (tasarimsal ve kotu goruntu) kurtuluyoruz.
• Admindeki ayar kismina yeni bir bolum ekledim, aciklama bolumu. Boylece yapacaginiz degiskligin ne icin oldugunu detayli sekilde gorebileceksiniz.
• Sosyal paylasim bolumunu sitenin en altina aldim, daha sade ve daha hos durdugunu dusunuyorum. Isteyen kendi temasini yaparak farkli bir sekil kullanabilir.
• Resimler yuklenirken, tek tek jquery ile formun altinda goruntulenir. Upload bittikten sonrada otomatik olarak extra upload formu alani gizlenir yerine toplu link alani cikar.
• Tasarimda da bazi kucuk degisiklikler yaptim. Twitter bootstrap in iconlari yerine*Font Awesome, the iconic font designed for Bootstrap sitesinin harika iconlarini kullandim. Ana sitede de bu icon setini kullaniyordum, API yede nasip oldu, iyide oldu
• Yeni resim formatlari eklendi. Tek sorun bu formatlar eski resimlerde bulunmadigi icin bunlarin goruntulenmesinde sorun olacak sitelerinizde. Yeni yuklenen resimler ile bu sorun ortadan kalkiyor, ancak eski resimler ve sayfalarinizda resimler gorunmezse heycanlanmayin. Orjinal resim ve kucuk resimler calisir durum olacaklar.
• Yeni resim formatlari: Orjinal boyut, medium:1024, thumb:250,thumb84: 84x84, avatar: 40x40
• Site adminleri icinde bir kac ozelligimiz oldu illaki Admin olarka giris yaptiginizda sitedeki butun resimleri gorebiliyorsunuz ve resim sayfalarina erisim saglayabiliyorsunuz. Ayrica resmin gosterildigi sayfada resim ismi yaninda resmi duzenleyebilmeniz icin link eklendi. Boylece direk duzenleme alanina gecebilirsiniz.
• Resmi yukleyen kisi sitenin her yerinde kendi resmi ozel yada +18 isaretli olsada gorebiliyor. Bu admin icinde resmi yukleyen icinde gecerli. Diger kisiler dogal olarak goremiyorlar, cunku yasak
• Site dili secimini en uste aldim, yeride guzel oldu, secimide kolaylastirdi diye dusunuyorum
• Admin tasarimini ellemedim. Ayni tas devrinden kaldigi gibi devam ediyorum Ana enerjiyi kullanici arayuzune yogunlastirmistim, zamanim kaladim, cikartmak zorundayim diye ellemedim. Ama hata kodlari ve iyilestirmeler yaptim tabiki
• Adminden ayarlar kismini kullanirken analistik kodu v.s eklemekde sorun oluyordu, bu tarz sorunlar giderildi.
• Bir cok alan icin ayri reklam alani ve ayari eklendi. Boylece indexde kullandiginiz reklami resim sayfasinda kullanmak zorunda kalmayacaksiniz.
• Resim gosterim sayfasinda meta taglara kisalink etiketi eklendi shortlink, sadece site-domain.com/1234 tarzinda
• Gelelim api ozelliklerine Ilk onemli tarafi guvenli upload olayinin onunu acmasi. Ve spam yapan uygulama gelistiricilerinin yasaklanabilmesidir. bunun yaninda Piclect.com daki sayfada sitenize link olusturulur ve o resimden sizin sitenize ne kadar ziyaretci gelmis gorebilirsiniz. Yada yuklediginiz iceriklere herbiri icin toplamda ne kadar ziyaretci almissiniz gorebilirsiniz. Toplam ziyaretci sayisi yani Bu istatistikleri gorebilmek icin developer bolumunde sitelerinize bakabilirsiniz.
• Kodlari ve yerlestirmelerini elimden geldigi kadar site acilis hizini artirmayacak sekilde yapmaya calistim. Google pagespeed hizi 80-84 lerde. Yapilacak sunucu ve host bazli degisikliklerle bu puan 100% lere kadar cikacaktir.

Simdilik bu kadar yazmak yeter, biraz video birazda resimlerle scripti tanitmis olayim, uzanip dinleneyim

Piclect API v6.0.1 - video test 1
http://www.screenr.com/embed/dpgN

Piclect API v6.0.1 - video test 2
http://www.screenr.com/embed/CpgN

Piclect API v6.0.1 - video test 3
http://www.screenr.com/embed/GpgN

Yukaridaki videolar ile sistemimizin isleyisini ve guzelligini kesfettiniz. Herseye ragmen soylemem gerekli, upload formu bazi tarayicilarin eski versiyonlarinda sorun cikarabilir. bu normal bisey. Ancak yeni versiyon tarayicilarda sorun cikmamaktadir.

API v6.0.1 versiyonu icin kurulum:
Yeni kurulum burdaki versiyon ile aynidir arkadaslar. Tek yapmaniz gereken dokumani takip edip yazilanlari yapmaniz. Bazi bolumlerde kucuk isim degisiklikleri olabilir. Ona fazla dikkat etmeyin: Piclect Api v4.x.x Kurulum dokumani.. | Makale yazıları

NOT: Sorunsuz kurulumdan sonra API anahtari almaniz gerekli. Aksi taktirde resim upload ozelligini kullanamayacaksiniz. Bunun anlatimina asagida yer verecegim.

API v6.0.1 versiyonu icin guncelleme:
Eski versiyonlardan guncelleme yapacak arkadaslar sirasi ile asagida yazdiklarimi yapsinlar.

• Sitenizin dosyalarini ve databasesini (sql) dosyalarini yedek alin.
• Sonrasinda ftpden dosyalarinizi silin yada bir klasor olusturun, icerisine tasiyin.
• yeni dosyalari yukleyin ve yukaridaki kurulum kismindaki DB bilgilerini ayarlama alanini yapin. Tek yapmaniz gereken database giris bilgilerini inc/config_db.php dosyasina girmeniz. Sonrasinda 4. adima gecin.
• Adres satirina bunu girin, siz kendi sitenize gore duzenleyin once: http://SITENIZcom/admin/guncelle.php
• ardindan yeni bilgiler eski databasenize eklenmis olacak. Ancak aciklama kisimlari eski tablolarda bos kalacak cunku onun icin uzun bir guncelleme vardi yapmadim. Onemli bir eksiklik degil, yine neyin ne oldugunu admindan anlayabiliyorsunuz
• Kurulum bitti. Ancak yapmaniz gereken en onemli sey API anahtari almak. Bunun icin altdaki API anahtari alma ile ilgili bolumu takip edin.

API anahtari almak ve guncellemek.
http://www.screenr.com/embed/qpgN

Video suresi yetmedi sonunu bitiremedim ama zaten konuyu anladiniz aldiginiz api anahtarini kendi sitenizde adminden en altda oluyor sanirim girmeniz

Bugunluk bu kadar anladim yeter. Herhangi bir problem yada sorunda asagidan iletisim kurabilir yorum atarak yardim isteyebilirsiniz. Ama israr etmeyin ayar olurum

NOT: Kullanim sozlesmesi istediginiz gibi degistirebilir kafaniza gore duzenleyebilirsiniz. Hatda kendinizde yeni temalar hazirlayabilirsiniz sistem icin. Bende bu konuda yardim etmeye hazir olacagim emin olabilirsiniz.

NOT2: Script ile ilgili ozel istek ve eklemeler ucret dahilinde zamanim olursa ve isi alirsam yaparim,*bunun icin sormaniz yeterli

Ornek resimler: