http://www.bildirgec.org/ tr-tr 40 bildirgec.org - SawioN - beğendikleri SawioN <p>genellikler blogcuların başvurduğu, içerik yönetim sistemi <a href="http://www.bildirgec.org/etiket/wordpress">wordpress</a> ile ticari siteler de hazırlamak mümkün. tabii bunun için birkaç eklentiye ve temaya ihtiyacınız var.<br><strong>eklentiler:</strong><br><a href="http://www.instinct.co.nz/e-commerce/">WordPress e-Commerce Plugin</a><br><div class="imajorta"><img src='http://www.bildirgec.org/imaj/bakiyyebemolu/wp-ecom.jpg' alt="\"\"" border="0"><br></div>sıklıkla kullanılan bu eklenti wordpress'e çeşitli ödeme araçlarını entegre etmenize olanak veriyor. eklentinin kişiselleştirilebilir olması da önemli bir artı.<br><a href="http://shopplugin.net/">shopp</a><div class="imajorta"><img src='http://www.bildirgec.org/imaj/bakiyyebemolu/shopp.jpg' alt="\"\"" border="0"><br></div>ücretli bir eklenti olan shopp ile yine internet üzerinden alışveriş imkanı veren sitelerle bağlantı kurabilirsiniz. <br><a href="http://wordpress.org/extend/plugins/eshop/">eshop</a><div class="imajorta"><img src='http://www.bildirgec.org/imaj/bakiyyebemolu/eshop.jpg' alt="\"\"" border="0"><br></div>stok kontrolü, istatistikler, ödeme metodları gibi çeşitli özelliklere sahip güzel bir eklenti.<br><a href="http://www.zackdesign.biz/wp-plugins/34">quick shop</a><div class="imajorta"><img src='http://www.bildirgec.org/imaj/bakiyyebemolu/quick-shop.jpg' alt="\"\"" border="0"><br></div>bu eklnti ile bir bileşen sayesinde alışveriş kartı ve "sepete ekleme" fonksiyonu oluşturabilirsiniz. <br><a href="http://wordpress.org/extend/plugins/yak-for-wordpress/">YAK for WordPress</a><div class="imajorta"><img src='http://www.bildirgec.org/imaj/bakiyyebemolu/yak.jpg' alt="\"\"" border="0"><br></div>yine wordpress için geliştirilmiş bir açık kaynak alışveriş kartı eklentisi.</p> <strong>temalar</strong> <ul> <li><a href="http://www.thekingcart.com/2008/10/02/crafty-cart-free-wordpress-ecommerce-plugin-theme/">Crafty Cart</a><div class="imajorta"><img src='http://www.bildirgec.org/imaj/bakiyyebemolu/crafty-cart.jpg' alt="\"\"" border="0"><br></div></li> </ul> <p><!-- buradan kes --></p> <ul> <li><a href="http://www.chris-wallace.com/2009/07/17/simplecartjs-a-free-wp-e-commerce-thematic-child-theme/">SimpleCart(js)</a><div class="imajorta"><img src='http://www.bildirgec.org/imaj/bakiyyebemolu/simple.jpg' alt="\"\"" border="0"><br></div></li> <li><a href="http://ecommercethemes.com/">Ecommerce Theme</a><div class="imajorta"><img src='http://www.bildirgec.org/imaj/bakiyyebemolu/ecom-theme.jpg' alt="\"\"" border="0"><br></div></li> <li><a href="http://www.markettheme.com/">Market Theme</a><div class="imajorta"><img src='http://www.bildirgec.org/imaj/bakiyyebemolu/market.jpg' alt="\"\"" border="0"><br></div></li> <li><a href="http://themeforest.net/item/wpshop/22102">WPShop</a><div class="imajorta"><img src='http://www.bildirgec.org/imaj/bakiyyebemolu/wp-shop.jpg' alt="\"\"" border="0"><br></div></li> <li><a href="http://themeforest.net/item/egoods/26764">eGoods</a><div class="imajorta"><img src='http://www.bildirgec.org/imaj/bakiyyebemolu/egoods-2.jpg' alt="\"\"" border="0"><br></div></li> <li><a href="http://themeforest.net/item/artshop/25348">ArtShop</a><div class="imajorta"><img src='http://www.bildirgec.org/imaj/bakiyyebemolu/art-shop.jpg' alt="\"\"" border="0"><br></div></li> </ul> <strong>dersler</strong> <ul> <li><a href="http://wordpress.tv/2009/06/08/create-an-ecommerce-website-with-wordpress-in-under-5-minutes/">5 dakikada bir e-ticari wordpress sitesi nasıl hazırlanır</a><div class="imajorta"><img src='http://www.bildirgec.org/imaj/bakiyyebemolu/wp-vid.jpg' alt="\"\"" border="0"><br></div></li> <li><a href="http://wordpress.tv/2009/03/16/getting-set-up-with-the-wp-e-commerce-plugin-settings-and-configuration/">WP e-Commerce eklentisinin özellikleri</a><div class="imajorta"><img src='http://www.bildirgec.org/imaj/bakiyyebemolu/plugin-settings.jpg' alt="\"\"" border="0"><br></div></li> <li><a href="http://ithemes.com/how-to-build-an-online-store-with-wordpress/">wordpress ile nasıl onlien store hazılanır</a><div class="imajorta"><img src='http://www.bildirgec.org/imaj/bakiyyebemolu/ithemes.jpg' alt="\"\"" border="0"><br></div></li> </ul> <p><a href="http://designm.ag/resources/wordpress-e-commerce/">kaynak</a></p><p>Bu yazı <a href="http://www.bildirgec.org/uye/SawioN">SawioN</a> tarafından <a href=" http://www.bildirgec.org/yazi/ticari-siteler-icin-wordpress ">bildirgec.org</a> adresli sitede yayımlanmak üzere yazılmıştır. Kaynak gösterilmeksizin kopyalanamaz.</p><hr>Pilli Projeleri: <a href="http://pilli.com">Pilli.com: Kolektif Bağımsız İçerik</a> | <a href="http://sosyomat.com">Sosyomat.com: Arkadaşını Etiketle</a> | <a href="http://put.io">Put.io: Online Cloud Storage</a> Fri, 31 Jul 2009 14:44:00 GMT 221789@http://www.bildirgec.org/ http://www.bildirgec.org/yazi/ticari-siteler-icin-wordpress SawioN <p><a href="http://www.bildirgec.org/etiket/wordpress">wordpress</a>in binlerce site sahibi tarafından kullanılan bir içerik yönetim sistemi olmasının bir nedeni de istenildiği kadar kişiselleştirilebilir bir esnekliğe sahip olması. wordpress'in mevcut yapısına eklemeler yapabileceğiniz çeşitli uygulamalar.</p> <strong>kendi sitenize özel bir <a href="http://en.gravatar.com/">gravatar</a> resmi</strong> <ul> <li><a href="http://codex.wordpress.org/Using_Gravatars">gravatar kullanımı</a></li> <li><a href="http://en.gravatar.com/site/signup">gravatar'a üye olun</a></li> <li><a href="http://www.problogdesign.com/general-tips/how-to-make-your-own-default-avatar-in-5-minutes/">5 dakikada kendi avatarınızı oluşturun</a></li> <li><a href="http://buildinternet.com/2009/02/how-to-change-the-default-gravatar-in-wordpress/">wordpress'in mevcut gravatar'ını değiştirme</a></li> </ul> örnekler:<br><div class="imajorta"><a href="http://www.myinkblog.com/"><img src='http://www.bildirgec.org/imaj/bakiyyebemolu/myinkblog.jpg' alt="\"\"" border="0"><br></a></div><br><div class="imajorta"><a href="http://buildinternet.com/"><img src='http://www.bildirgec.org/imaj/bakiyyebemolu/buildinternet.jpg' alt="\"\"" border="0"><br></a></div><br><div class="imajorta"><a href="http://10steps.sg/"><img src='http://www.bildirgec.org/imaj/bakiyyebemolu/10steps.jpg' alt="\"\"" border="0"><br></a></div><br><strong>yayıncı yorumlarını diğer yorumlardan farklı gösterme</strong> <ul> <li><a href="http://rmarsh.com/plugins/highlight-comments/">yazar yorumlarını belirginleştirme eklentisi</a></li> </ul> <p><!-- buradan kes --></p> <ul> <li><a href="http://www.wprecipes.com/how-to-style-author-comments-in-wordpress-27">wordpress'te yazar yorumlarını biçimlendirme</a></li> <li><a href="http://www.problogdesign.com/how-to/style-author-comments-differently/">yazar yorumlarını farklı olarak gösterme</a></li> </ul> <p>örnekler:<br><div class="imajorta"><a href="http://www.brianyerkes.com/"><img src='http://www.bildirgec.org/imaj/bakiyyebemolu/brianyerks.jpg' alt="\"\"" border="0"><br></a></div><br><div class="imajorta"><a href="http://www.noupe.com/"><img src='http://www.bildirgec.org/imaj/bakiyyebemolu/noupe.jpg' alt="\"\"" border="0"><br></a></div><br><div class="imajorta"><a href="http://thinkdesignblog.com/"><img src='http://www.bildirgec.org/imaj/bakiyyebemolu/thinkdesign.jpg' alt="\"\"" border="0"><br></a></div></p> <strong>"hakkında" sayfanız için yapabileceğiniz çalışmalar</strong> <ul> <li><a href="http://www.problogger.net/archives/2005/03/23/random-blog-tip-include-an-about-page/">blogunuza hakkında sayfası ekleyin</a></li> <li><a href="http://www.smashingmagazine.com/2009/07/01/best-practices-for-effective-design-of-about-us-pages/">hakkında sayfası için yapabileceğiniz çalışmalar</a></li> <li><a href="http://writetodone.com/2009/05/18/five-tips-and-a-bonus-on-how-to-write-a-fantastic-about-page/">hakkında sayfası yazımı için 5 ipucu</a></li> </ul> <p>örnekler:<br><div class="imajorta"><a href="http://www.fudgegraphics.com/about/"><img src='http://www.bildirgec.org/imaj/bakiyyebemolu/fudgegraphics.jpg' alt="\"\"" border="0"><br></a></div><br><div class="imajorta"><a href="http://www.intuitivedesigns.net/"><img src='http://www.bildirgec.org/imaj/bakiyyebemolu/intuitivedesigns.jpg' alt="\"\"" border="0"><br></a></div><br><div class="imajorta"><a href="http://mattbrett.com/about/"><img src='http://www.bildirgec.org/imaj/bakiyyebemolu/mattbrett.jpg' alt="\"\"" border="0"><br></a></div></p> <strong>blogunuzun "footer" bölümünü etkin kullanın</strong> <ul> <li><a href="http://www.reencoded.com/2009/07/07/20-great-wordpress-footer-designs-for-inspiration/">20 örnek wordpress footer tasarımı</a></li> <li><a href="http://net.tutsplus.com/tutorials/wordpress/dont-ignore-your-wordpress-footer/">wordpress footer bölümünü gözardı etmeyin</a></li> <li><a href="http://www.sueblimely.com/add-widget-ready-sidebars-to-wordpress-footers/">footer bölümüne site bileşenleri eklemek</a></li> <li><a href="http://lorelle.wordpress.com/2007/09/30/customizing-your-wordpress-theme-footer/">footer bölümünü kişiselleştirmek</a></li> </ul> <p>örnekler:<br><div class="imajorta"><a href="http://www.bcandullo.com/"><img src='http://www.bildirgec.org/imaj/bakiyyebemolu/bcandullo.jpg' alt="\"\"" border="0"><br></a></div><br><div class="imajorta"><a href="http://www.blog.spoongraphics.co.uk/"><img src='http://www.bildirgec.org/imaj/bakiyyebemolu/spoon.jpg' alt="\"\"" border="0"><br></a></div><br><div class="imajorta"><a href="http://www.assaultblog.com/"><img src='http://www.bildirgec.org/imaj/bakiyyebemolu/assaultblog.jpg' alt="\"\"" border="0"><br></a></div></p> <strong>404 bulunamadı sayfası</strong> <ul> <li><a href="http://www.smashingmagazine.com/404">Smashing Magazine'in bu sayfaya dair ipuçları ve örnekleri</a></li> <li><a href="http://themeplayground.com/2007/tutorials/for-wordpress-users/customize-your-404-page/">404 sayfanızı kişiselleştirin</a></li> <li><a href="http://wphacks.com/wordpress-tip-customizing-404-page/">wordpress ipucu: 404 sayfasını düzenlemek</a></li> <li><a href="http://www.alistapart.com/articles/perfect404/">A List Apart'tan mükemmel 404 sayfası</a></li> <li><a href="http://www.makeuseof.com/tag/build-a-great-website-404-page-20-examples/">404 sayfası yapımı ve 10 örnek</a></li> </ul> <p>örnekler:<br><div class="imajorta"><a href="http://www.inspirationbit.com/404"><img src='http://www.bildirgec.org/imaj/bakiyyebemolu/inspirationbit.jpg' alt="\"\"" border="0"><br></a></div><br><div class="imajorta"><a href="http://www.problogger.net/404/"><img src='http://www.bildirgec.org/imaj/bakiyyebemolu/problogger.jpg' alt="\"\"" border="0"><br></a></div><br><div class="imajorta"><a href="http://veerle.duoh.com/404"><img src='http://www.bildirgec.org/imaj/bakiyyebemolu/veerle.jpg' alt="\"\"" border="0"><br></a></div></p> <strong>wordpress'i çeşitli sosyal siteler ile bütünleştirmek</strong> <ul> <li><a href="http://eightface.com/wordpress/flickrrss/">flickr rss eklentisi</a></li> <li><a href="http://www.ericlightbody.com/2009/07/19/tweetiepie-for-wordpress/">TweetiePie eklentisi</a></li> <li><a href="http://wordpress.tv/2009/07/24/twitter-selfhosted/">yan menüye twitter güncellemelerini eklemek</a></li> <li><a href="http://mcbuzz.wordpress.com/2008/07/08/wordpress-tutorial-how-to-add-flickr-photo-widget-sidebar/">flickr fotoğraf bileşenini eklemek</a></li> </ul> <p>örnekler:<br><div class="imajorta"><a href="http://kailoon.com/"><img src='http://www.bildirgec.org/imaj/bakiyyebemolu/loon.jpg' alt="\"\"" border="0"><br></a></div><br><div class="imajorta"><a href="http://www.leemunroe.com/"><img src='http://www.bildirgec.org/imaj/bakiyyebemolu/leemunroe.jpg' alt="\"\"" border="0"><br></a></div><br><div class="imajorta"><a href="http://www.ilovecolors.com.ar/"><img src='http://www.bildirgec.org/imaj/bakiyyebemolu/ilovecolor.jpg' alt="\"\"" border="0"><br></a></div></p> <strong>yazar veya site sahibini belirgin hale getirmek</strong> <ul> <li><a href="http://www.dagondesign.com/articles/posts-by-author-plugin-for-wordpress/">yazı sahibi eklentisi</a></li> <li><a href="http://wordpress.org/extend/plugins/multiple-authors/">birden fazla yazar eklentisi</a></li> <li><a href="http://gabediaz.com/blog/displaying-author-pic-and-bio-in-your-wordpress-post/">gravatar olmadan yazı altında yazar hakkında bilgi ve resim göstermek</a></li> <li><a href="http://themeshaper.com/how-to-add-gravatars-for-the-post-author-in-wordpress/">yazı sahiplerine gravatar eklemek</a></li> </ul> <p>örnekler:<br><div class="imajorta"><a href="http://www.tutorial9.net/"><img src='http://www.bildirgec.org/imaj/bakiyyebemolu/tutorial9.jpg' alt="\"\"" border="0"><br></a></div><br><div class="imajorta"><a href="http://fuelyourcoding.com/"><img src='http://www.bildirgec.org/imaj/bakiyyebemolu/fycoding.jpg' alt="\"\"" border="0"><br></a></div><br><div class="imajorta"><a href="http://line25.com/"><img src='http://www.bildirgec.org/imaj/bakiyyebemolu/line25.jpg' alt="\"\"" border="0"><br></a></div></p> <strong>okuyucular ile bütünleşmek</strong> <ul> <li><a href="http://sexybookmarks.net/">Sexy(?)Bookmarks eklentisi</a></li> <li><a href="http://push.cx/sociable">Sociable eklentisi</a></li> <li><a href="http://anidandesign.com/wordpress/social-media-and-wordpress/">sosyal siteler ve wordpress</a></li> <li><a href="http://www.johntp.com/2006/05/25/10-ways-to-engage-readers-on-your-blog/">blogunuzu ve okuyucularınızı birbirine bağlamanın 10 yolu</a></li> </ul> <p>örnekler:<br><div class="imajorta"><a href="http://wellmedicated.com/"><img src='http://www.bildirgec.org/imaj/bakiyyebemolu/wellmedicated.jpg' alt="\"\"" border="0"><br></a></div><br><div class="imajorta"><a href="http://colorburned.com/"><img src='http://www.bildirgec.org/imaj/bakiyyebemolu/colorburned.jpg' alt="\"\"" border="0"><br></a></div><br><div class="imajorta"><a href="http://www.nikibrown.com/designoblog"><img src='http://www.bildirgec.org/imaj/bakiyyebemolu/designoblog.jpg' alt="\"\"" border="0"><br></a></div></p> <strong>kapsamlı bir arşiv sayfası hazırlamak</strong> <ul> <li><a href="http://wphacks.com/how-to-create-an-archive-page-for-your-wordpress-blog/">wordpress blogunuzun için arşiv sayfası hazırlama</a></li> <li><a href="http://www.pearsonified.com/2006/11/wicked-wordpress-archives-in-one-easy-step.php">kolay bir adımla arşiv sayfası</a></li> <li><a href="http://www.wpbeginner.com/wp-tutorials/how-to-create-an-archives-page-in-wordpress/">wordpress'te arşiv sayfası nasıl oluşturulur</a></li> <li><a href="http://www.geekwithlaptop.com/about/projects/clean-archives">Clean Archives eklentisi</a></li> <li><a href="http://www.prelovac.com/vladimir/wordpress-plugins/snazzy-archives">Snazzy Archives eklentisi</a></li> </ul> <p>örnekler:<br><div class="imajorta"><a href="http://sixrevisions.com/all-articles/"><img src='http://www.bildirgec.org/imaj/bakiyyebemolu/sixrevisions.jpg' alt="\"\"" border="0"><br></a></div><br><div class="imajorta"><a href="http://www.prelovac.com/vladimir/archive-spec?layout=1&fx=0"><img src='http://www.bildirgec.org/imaj/bakiyyebemolu/snazzy.jpg' alt="\"\"" border="0"><br></a></div><br><div class="imajorta"><a href="http://www.jankoatwarpspeed.com/archive.aspx"><img src='http://www.bildirgec.org/imaj/bakiyyebemolu/janko.jpg' alt="\"\"" border="0"><br></a></div></p> <strong>wordpress giriş bölümünü kişiselleştirme</strong> <ul> <li><a href="http://www.bittbox.com/wordpress/handy-wp-plugin-customize-your-wordpress-login-page/">Handy WP eklentisi: wordpress giriş bölümünü kişiselleştirin</a></li> <li><a href="http://www.binarymoon.co.uk/2007/07/wordpress-tips-and-tricks-custom-login-page/">kişisel giriş sayfası</a></li> <li><a href="http://onemansblog.com/2007/01/17/customizing-the-wordpress-user-login-screen/">10 adımda kullanıcı giriş bölümünü düzenleme</a></li> </ul> <p>örnekler:<br><div class="imajorta"><a href="http://www.flickr.com/photos/prisca_eyedea/2912930538/in/pool-bm-custom-login"><img src='http://www.bildirgec.org/imaj/bakiyyebemolu/login1.jpg' alt="\"\"" border="0"><br></a></div><br><div class="imajorta"><a href="http://www.flickr.com/photos/theenglishguy/2859975321/in/pool-bm-custom-login"><img src='http://www.bildirgec.org/imaj/bakiyyebemolu/login2.jpg' alt="\"\"" border="0"><br></a></div><br><div class="imajorta"><a href="http://www.flisterz.com/2007/08/28/custom-wordpress-login-page/"><img src='http://www.bildirgec.org/imaj/bakiyyebemolu/login3.jpg' alt="\"\"" border="0"><br></a></div></p> <p><a href="http://www.problogdesign.com/wordpress/10-ways-to-customize-and-personalize-your-wordpress-blog/">kaynak</a></p><p>Bu yazı <a href="http://www.bildirgec.org/uye/SawioN">SawioN</a> tarafından <a href=" http://www.bildirgec.org/yazi/wordpress-duzenleme-ve-kisisellestirme-yollari ">bildirgec.org</a> adresli sitede yayımlanmak üzere yazılmıştır. Kaynak gösterilmeksizin kopyalanamaz.</p><hr>Pilli Projeleri: <a href="http://pilli.com">Pilli.com: Kolektif Bağımsız İçerik</a> | <a href="http://sosyomat.com">Sosyomat.com: Arkadaşını Etiketle</a> | <a href="http://put.io">Put.io: Online Cloud Storage</a> Tue, 08 Sep 2009 14:32:00 GMT 221788@http://www.bildirgec.org/ http://www.bildirgec.org/yazi/wordpress-duzenleme-ve-kisisellestirme-yollari SawioN <p><a href="http://www.bildirgec.org/ara/jquery">Jquery</a> ile sitenize inanılmaz özellikler ekleyebilirsiniz. Bu yazıda Ağustos 2009'un en iyi jquery <a href="http://www.bildirgec.org/ara/eklentiler">eklentiler</a>i yer almaktadır.</p> <p>1. <a href="http://plugins.jquery.com/project/IPWEditor">IPWEditor - In-Place WYSIWYG Editor</a></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/LeBron/ipw.png' alt="\"\"" border="0"><br></div> <p>Zengin gelişmiş metin editörüdür. Giriş alanı ile yazıları kolayca düzenleyebilirsiniz.</p> <p>2. <a href="http://plugins.jquery.com/project/jLoupe">jLoupe</a></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/LeBron/jloupe.png' alt="\"\"" border="0"><br></div> <p>Resimlere kolayca büyüteç efekti ekler. Dilediğiniz resimlere "jLoupe" sınıfını ekleyerek kolayca efekti uygulayabilirsiniz.<br><!-- buradan kes --></p> <p>3. <a href="http://plugins.jquery.com/project/reel">Reel</a></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/LeBron/jqreel.png' alt="\"\"" border="0"><br></div> <p>Bir şey veya birşeyin gösterimi 360 derece gösterimi için kullanabileceğiniz jquery eklentisi.</p> <p>4. <a href="http://plugins.jquery.com/project/twit">Twit</a></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/LeBron/jqtwit.png' alt="\"\"" border="0"><br></div> <p>Blog üzerinde twitter durumunu gösterebileceğiniz jquery eklentisi.</p> <p>5. <a href="http://plugins.jquery.com/project/Quovolver">Quovolver</a></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/LeBron/quovolver.png' alt="\"\"" border="0"><br></div> <p>Yazıyı basit bir şekilde grup içine alır.</p> <p>6. <a href="http://plugins.jquery.com/project/textresizer">jQuery Text Resizer</a></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/LeBron/jqtextres.png' alt="\"\"" border="0"><br></div> <p>Genellikle haber sitelerinde kullanılan bu eklenti ile yazıları büyültebilir veya küçültebilirsiniz.</p> <p>7. <a href="http://plugins.jquery.com/project/tab-slide-out">Tab SlideOut</a></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/LeBron/tabslide-screenshot.jpg' alt="\"\"" border="0"><br></div> <p>İletişim formu için kullanabileceğiniz yana doğru açılan bir sekme gösterir.</p> <p>8. <a href="http://plugins.jquery.com/project/BinaryTree">Binary Tree</a></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/LeBron/btree.png' alt="\"\"" border="0"><br></div> <p>Bu eklenti size sadece bir çağırış ile tüm div'leri ikili ağaç sistemine getirmenize izin verir.</p> <p>9. <a href="http://plugins.jquery.com/project/DivCorners">DivCorners</a></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/LeBron/jqdivcorn.png' alt="\"\"" border="0"><br></div> <p>Bu eklenti içeriğin kenarı, yuvarlatılmış köşeler, gölge gibi efektler eklemenizi amaçlamaktadır.</p> <p>10. <a href="http://plugins.jquery.com/project/columnize">Columnize</a></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/LeBron/columnize.png' alt="\"\"" border="0"><br></div> <p>Gazete gibi bir sütun oluşturmanızı sağlar. Orjinal Html kodu küçük adaptasyon için gereklidir. Çoğu zaman bu işleme gerek yoktur.</p> <p>11. <a href="http://plugins.jquery.com/project/jqDialog">jqDialog</a></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/LeBron/jqdial.png' alt="\"\"" border="0"><br></div> <p>Yeni bir bilgi penceresi açmak için kullanabileceğiniz kullanışlı bir jquery eklentisidir.</p> <p>12. <a href="http://plugins.jquery.com/project/AjaxPanel">AjaxPanel</a></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/LeBron/jqajaxpan.png' alt="\"\"" border="0"><br></div> <p>HTML elemanlarınızı güncellemek için tek tip bir yol sağlar.</p> <p>13. <a href="http://plugins.jquery.com/project/subscribe">subscribe</a></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/LeBron/jqsubs.png' alt="\"\"" border="0"><br></div> <p>Yayıncı ve abone olay toplayıcı olarak kullanılan jquery eklentisidir.</p> <p>14. <a href="http://plugins.jquery.com/project/Hovertip">jQuery Hovertip - Minimalist tooltip</a></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/LeBron/minimhover.png' alt="\"\"" border="0"><br></div> <p>İpucu göstermek için kullanışlı bir jquery eklentisi.</p> <p>15. <a href="http://plugins.jquery.com/project/simpleImageCheck">jQuery SimpleImageCheck</a></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/LeBron/imgcheck.png' alt="\"\"" border="0"><br></div> <p>Süper bir şekilde kişisel onay kutucukları yapar. Tek yapmanız gereken alanlarınız için UI fonksiyonunu çağırmaktır.</p> <p><strong>yazının devamı için <a href="http://www.ajaxline.com/best-jquery-plugins-august-2009">buraya</a> tıklayın.</strong></p> <p>ayrıca aşağıdaki yazılarda ilginizi çekebilir.</p> <ul> <li><a href="http://www.bildirgec.org/yazi/haziran-2009-un-en-iyi-1">Haziran 2009'un En İyi Jquery Dersleri</a></li> </ul> <ul> <li><a href="http://www.bildirgec.org/yazi/ucretsiz-jquery-slider-icin-en">Ücretsiz Jquery Slider İçin En İyi 15 Örnek</a></li> </ul> <ul> <li><a href="http://www.bildirgec.org/yazi/jquery-oyunlari-hafiza-tetris-bulmaca">Jquery Oyunları - Hafıza, Tetris, Bulmaca, Kağıt...</a></li> </ul> <ul> <li><a href="http://www.bildirgec.org/yazi/7-ilginc-jquery-takvim-eklentisi">7 İlginç Jquery Takvim Eklentisi</a></li> </ul> <ul> <li><a href="http://www.bildirgec.org/yazi/tasarimcilar-icin-faydali-28-jquery">Tasarımcılar İçin Faydalı 28 Jquery Eklentisi</a></li> </ul> <ul> <li><a href="http://www.bildirgec.org/yazi/jquery-kullanan-en-iyi-24">Jquery Kullanan En İyi 24 Site</a></li> </ul> <ul> <li><a href="http://www.bildirgec.org/yazi/flash-gibi-jquery-menu">Flash Gibi Jquery Menü</a></li> </ul> <ul> <li><a href="http://www.bildirgec.org/yazi/sitenize-eklemeniz-icin-5-jquery">Sitenize Eklemeniz İçin 5 Jquery ve Ajax Sosyal İmleme Widget Dersi</a></li> </ul> <ul> <li><a href="http://www.bildirgec.org/yazi/web-gelistiricileri-icin-8-jquery">Web Geliştiricileri İçin 8 Jquery ve ve Ajax Tabanlı Etiket Bulutu Yapımı</a></li> </ul> <ul> <li><a href="http://www.bildirgec.org/yazi/15-mukemmel-jquery-navigasyon-teknigi">15 Mükemmel Jquery Navigasyon Tekniği ve Çözümü</a></li> </ul> <p><strong>kaynak:</strong> <a href="http://www.ajaxline.com/best-jquery-plugins-august-2009">ajaxline.com</a></p> <p>yazılarımı takip edebilirsiniz.</p> <ul> <li><a href="http://lebron.bildirgec.org/">blog</a> | <a href="http://twitter.com/lebron5">twitter</a> | <a href="http://friendfeed.com/lebron5">friendfeed</a> | <a href="http://delicious.com/lebron5">delicious</a> | <a href="http://feeds.feedburner.com/lebron">rss</a></li> </ul><p>Bu yazı <a href="http://www.bildirgec.org/uye/SawioN">SawioN</a> tarafından <a href=" http://www.bildirgec.org/yazi/agustos-2009-un-en-iyi-1 ">bildirgec.org</a> adresli sitede yayımlanmak üzere yazılmıştır. Kaynak gösterilmeksizin kopyalanamaz.</p><hr>Pilli Projeleri: <a href="http://pilli.com">Pilli.com: Kolektif Bağımsız İçerik</a> | <a href="http://sosyomat.com">Sosyomat.com: Arkadaşını Etiketle</a> | <a href="http://put.io">Put.io: Online Cloud Storage</a> Wed, 09 Sep 2009 06:47:00 GMT 221787@http://www.bildirgec.org/ http://www.bildirgec.org/yazi/agustos-2009-un-en-iyi-1 SawioN <p>İnternet araçları hayatın vazgeçilmezi! Hem çok eğlenceli, hem çok kullanışlı 6 araç sunuyoruz.</p> <p><a href="http://www.patorjk.com/software/taag/"><strong>1. Text Ascii Art Generator</strong></a></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/berryberk/bildirgec.jpg' alt="Kullanılan Font: Swan" border="0"><br>Kullanılan Font: Swan</div> <p>Word'deki <a href="http://www.dafont.com/">font</a>lar, <a href="http://www.bildirgec.org/yazi/en-iyi-41-photoshop-efekti">photoshop</a> fontları size az mı geldi? Şöyle "adımı, lakabımı yazsam ama enteresan, sıradışı olsa" mı diyorsunuz? O zaman nokta, virgül, ünlem gibi tek başına anlam ifade etmeyen gariban noktalama işaretleri ile yazın isminizi. İster Coca Cola stilinde ister dans eden harfler şeklinde. Bu internet sitesi tam senlik! Forumlarda havan olsun.</p> <p><a href="http://www.revfad.com/oldflip.html"><strong>2. Flip</strong></a></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/berryberk/flip.jpg' alt="revfad.com" border="0"><br>revfad.com</div> <p>Dünyanın en işe yaramaz, en itici aparatı. <a href="http://tr.msn.com/">msn</a>'de kullanın, arkadaşınızı, sevgilinizi sinir edin! gir-gör-bak-kullan-gıcık et-gıcık ol!</p> <p><!-- buradan kes --></p> <p><a href="http://www.urlpass.com/"><strong>3. UrlPass</strong></a></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/berryberk/urlpass.jpg' alt="urlPass" border="0"><br>urlPass</div> <p>Bazı sitelerde büyük harf kullanılmaz. Ama o youtube linkini vermeden de duramazsınız, illa ki yazmak, elalemi de kendinizle birlikte yarmanız gerekir. Şimdi linkte f mi büyüktü m büyüktü diye uğraşmak, çok kişiyi mutlu etmez. linkiniz kısa, vaktiniz bol kalsın.</p> <p><a href="http://yooouuutuuube.com/"><strong>4. YooouuuTuuube</strong></a></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/berryberk/adam.jpg' alt="YooouuuTuuube" border="0"><br>YooouuuTuuube</div> <p><a href="http://www.ktunnel.com/index.php/1010110A/01f26c7438af68db3b9909295f02060188ac7f4d2a16708">youtube</a>'dan bir video indirdiniz ama boyutunu beğenmediniz. şöyle üstten alsam, yandan çekiştirsem daha mı güzel olacak sanki diyorsunuz. o zaman yooouuutuuube'a bir bakın.</p> <p><a href="http://www.homepagestartup.com/"><strong>5. homepagestartup</strong></a></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/berryberk/hpsu.jpg' alt="homepagestartup" border="0"><br>homepagestartup</div> <p>an gelir, bir bakarsınız ki geri dönüşüm kutunuzu masaüstünde bulamazsınız. işte o an biraz toparlanmaya başlamanız gereken andır. Bu site ile masaüstünüzü kendine getireceksiniz ve geri dönüşüm kutunuz hep aynı yerde duruyor olacak.</p> <p><a href="http://spellcheck.cc/"><strong>6. SpellCheck</strong></a></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/berryberk/spellcheck.jpg' alt="SpellCheck" border="0"><br>SpellCheck</div> <p>Bazı dillerde imla çok önemlidir, Fransızca'da olduğu gibi. SpellCheck, <a href="http://tr.wikipedia.org/wiki/Fince">Fince</a>'den İsveççe'ye 12 ayrı dilde size yardımcı olacak. Dilinizi seçin, paragrafınızı kopyalayın o sizin için her şeyi daha güzel yapsın.</p><p>Bu yazı <a href="http://www.bildirgec.org/uye/SawioN">SawioN</a> tarafından <a href=" http://www.bildirgec.org/yazi/muhtemelen-gormediginiz-eglenceli-6-arac ">bildirgec.org</a> adresli sitede yayımlanmak üzere yazılmıştır. Kaynak gösterilmeksizin kopyalanamaz.</p><hr>Pilli Projeleri: <a href="http://pilli.com">Pilli.com: Kolektif Bağımsız İçerik</a> | <a href="http://sosyomat.com">Sosyomat.com: Arkadaşını Etiketle</a> | <a href="http://put.io">Put.io: Online Cloud Storage</a> Thu, 03 Sep 2009 16:59:00 GMT 221149@http://www.bildirgec.org/ http://www.bildirgec.org/yazi/muhtemelen-gormediginiz-eglenceli-6-arac SawioN <p>Birbirinden güzel <a href="http://www.bildirgec.org/ara/grafik">grafik</a> çalışmalarının bulunduğu <a href="http://www.bildirgec.org/ara/deviantart">deviantart</a> üzerinde, birbirinden etkili <a href="http://www.bildirgec.org/ara/web%20aray%C3%BCz">web arayüz</a> çalışmaları da yer almaktadır. Birkaç basit adımda biraz dikkatli davranarak profesyonel çalışmalara imza atmak mümkün. Bu yazıda deviantart'tan alınma, bazıları ücretsiz yeni web arayüzleri, tasarımlarınıza ilham kaynağı olacaktır.</p> <p>1. <a href="http://edumicro.deviantart.com/art/PaperBlog-131944187">PaperBlog</a></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/LeBron/paperpblog-deviantart-inspirational-creative-web-design.jpg' alt="\"\"" border="0"><br></div> <p>2. <a href="http://ejsing.deviantart.com/art/Pintley-Website-131366905">Pintley Website</a></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/LeBron/pintley-deviantart-inspirational-creative-web-design.jpg' alt="\"\"" border="0"><br></div><br><!-- buradan kes --> <p>3. <a href="http://edumicro.deviantart.com/art/MyFolio-2-133345824">MyFolio 2</a></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/LeBron/my-folio-2-deviantart-inspirational-creative-web-design.jpg' alt="\"\"" border="0"><br></div> <p>4. <a href="http://bboywicked.deviantart.com/art/Aquaffect-133100166">Aquaffect</a></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/LeBron/aquaeffect-deviantart-inspirational-creative-web-design.jpg' alt="\"\"" border="0"><br></div> <p>5. <a href="http://nodethirtythree.deviantart.com/art/Template-14-for-4T-132491810">Template 14 for 4T</a></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/LeBron/template-14-deviantart-inspirational-creative-web-design.jpg' alt="\"\"" border="0"><br></div> <p>6. <a href="http://hinok.deviantart.com/art/Creative-Wroclaw-131959418">Creative Wroclaw</a></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/LeBron/wroclaw-deviantart-inspirational-creative-web-design.jpg' alt="\"\"" border="0"><br></div> <p>7. <a href="http://ejsing.deviantart.com/art/Ejsing-Graphics-White-layout-132218610">Ejsing Graphics – White layout</a></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/LeBron/ejsing-graphics-deviantart-inspirational-creative-web-design.jpg' alt="\"\"" border="0"><br></div> <p>8. <a href="http://ecp-pro.deviantart.com/art/Ambiground-130940718">Ambiground</a></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/LeBron/ambiground-deviantart-inspirational-creative-web-design.jpg' alt="\"\"" border="0"><br></div> <p>9. <a href="http://alxdesign.deviantart.com/art/FreshPress-133931852">FreshPress</a></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/LeBron/fresh-press-deviantart-inspirational-creative-web-design.jpg' alt="\"\"" border="0"><br></div> <p>10. <a href="http://z-design.deviantart.com/art/Zanimation-Portfolio-2009-133688511">Zanimation Portfolio 2009</a></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/LeBron/zanimation-deviantart-inspirational-creative-web-design.jpg' alt="\"\"" border="0"><br></div> <p>11. <a href="http://alxdesign.deviantart.com/art/Edge-134614056">Edge</a></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/LeBron/edge-deviantart-inspirational-creative-web-design.jpg' alt="\"\"" border="0"><br></div> <p>12. <a href="http://sencerbugrahan.deviantart.com/art/smfyoo-131701715">smfyoo</a></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/LeBron/smfyoo-deviantart-inspirational-creative-web-design.jpg' alt="\"\"" border="0"><br></div> <p>13. <a href="http://osec.deviantart.com/art/easo-134543320">easo</a></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/LeBron/easo-deviantart-inspirational-creative-web-design.jpg' alt="\"\"" border="0"><br></div> <p>14. <a href="http://sencerbugrahan.deviantart.com/art/TopBird-Admin-132464151">TopBird Admin </a></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/LeBron/topbird-admin-deviantart-inspirational-creative-web-design.jpg' alt="\"\"" border="0"><br></div> <p>15. <a href="http://dioxyzone.deviantart.com/art/JustBlue-134449649">JustBlue</a></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/LeBron/justblue-deviantart-inspirational-creative-web-design.jpg' alt="\"\"" border="0"><br></div> <p>16. <a href="http://sencerbugrahan.deviantart.com/art/Muxo-Joomla-Theme-131881607">Muxo Joomla Theme</a></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/LeBron/muxo-deviantart-inspirational-creative-web-design.jpg' alt="\"\"" border="0"><br></div> <p>17. <a href="http://sneakyone1990.deviantart.com/art/Naturebloggers-131331149">Naturebloggers</a></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/LeBron/nature-bloggers-deviantart-inspirational-creative-web-design.jpg' alt="\"\"" border="0"><br></div> <p>18. <a href="http://ejsing.deviantart.com/art/SODRINK-Layout-133088860">SODRINK Layout</a></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/LeBron/sodrink-deviantart-inspirational-creative-web-design.jpg' alt="\"\"" border="0"><br></div> <p>19. <a href="http://alivepixel.deviantart.com/art/SeoHero-133722634">SeoHero</a></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/LeBron/seohero-deviantart-inspirational-creative-web-design.jpg' alt="\"\"" border="0"><br></div> <p>20. <a href="http://cerebrocreativo.deviantart.com/art/Mockup-GC-132860668">Mockup.GC</a></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/LeBron/mockup-guerra-deviantart-inspirational-creative-web-design.jpg' alt="\"\"" border="0"><br></div> <p>21. <a href="http://coronalemon.deviantart.com/art/keim-cc-131366715">Keim.cc</a></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/LeBron/keim-cc-deviantart-inspirational-creative-web-design.jpg' alt="\"\"" border="0"><br></div> <p>22. <a href="http://sencerbugrahan.deviantart.com/art/GoldPress-132627309">GoldPress </a></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/LeBron/goldpress-deviantart-inspirational-creative-web-design.jpg' alt="\"\"" border="0"><br></div> <p>23. <a href="http://dioxyzone.deviantart.com/art/Dioxyportfolio-09-134200423">Dioxyportfolio 09</a></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/LeBron/dioxy-portfolio-deviantart-inspirational-creative-web-design.jpg' alt="\"\"" border="0"><br></div> <p>24. <a href="http://ejsing.deviantart.com/art/DressUp-Layout-134108469">DressUp Layout</a></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/LeBron/dressup-deviantart-inspirational-creative-web-design.jpg' alt="\"\"" border="0"><br></div> <p><strong>yazının devamı için <a href="http://www.1stwebdesigner.com/inspiration/48-trendy-and-fresh-web-interfaces-from-deviantart-august-2009/">buraya</a> tıklayın.</strong></p> <p><strong>kaynak:</strong> <a href="http://www.1stwebdesigner.com/inspiration/48-trendy-and-fresh-web-interfaces-from-deviantart-august-2009/">1stwebdesigner.com</a></p> <p>yazılarımı takip edebilirsiniz.</p> <ul> <li><a href="http://lebron.bildirgec.org/">blog</a> | <a href="http://twitter.com/lebron5">twitter</a> | <a href="http://friendfeed.com/lebron5">friendfeed</a> | <a href="http://delicious.com/lebron5">delicious</a> | <a href="http://feeds.feedburner.com/lebron">rss</a></li> </ul><p>Bu yazı <a href="http://www.bildirgec.org/uye/SawioN">SawioN</a> tarafından <a href=" http://www.bildirgec.org/yazi/deviantart-dan-modaya-uygun-ve ">bildirgec.org</a> adresli sitede yayımlanmak üzere yazılmıştır. Kaynak gösterilmeksizin kopyalanamaz.</p><hr>Pilli Projeleri: <a href="http://pilli.com">Pilli.com: Kolektif Bağımsız İçerik</a> | <a href="http://sosyomat.com">Sosyomat.com: Arkadaşını Etiketle</a> | <a href="http://put.io">Put.io: Online Cloud Storage</a> Sat, 29 Aug 2009 13:45:00 GMT 220548@http://www.bildirgec.org/ http://www.bildirgec.org/yazi/deviantart-dan-modaya-uygun-ve SawioN <div class="imajorta"><img src='http://www.bildirgec.org/imaj/pinkfloyd/08-jquery-logo.png' alt="\"\"" border="0"><br></div> <p>Belki tam bir jQuery uzmanısınız. Ya ne olacak canım, John Resig'in tam kendisisiniz belki de... Ya da Bildirgeç üzerinde "Prototip", "<a href="http://www.bildirgec.org/etiket/jquery">jQuery</a>", ve "<a href="http://www.bildirgec.org/etiket/mootools/">Mootools</a>" gibi kelimeleri görüp "Bunlar da ne ola ki?" diye hayıflanıp duruyorsunuz... Şimdi tüm bunları öğrenmenin zamanı geldi.</p> <p>Bu endüstride, -özellikle günümüzde daha önce hiç olmadığı kadar-, tasarımcılar kodculara, kodcular da tasarımcılara dönüşüyor... Bir geliştiricinin görevi SADECE ön ya da arkaplan işlerini yürüten kod yazmak olmaktan çıkıyor. jQuery işte bu aradaki mesafeyi kapatmaya yardımcı olan bir JavaScript kütüphanesi. JavaScript erişilemez bir yetenek değil. Daha önce yayımladığım <a href="http://www.bildirgec.org/yazi/size-sifirdan-php-ogretecek-25">size sıfırdan PHP öğretecek 25 kaynak</a> yazısının site kullanıcıları tarafından çok tutulan bir yazı olduğunu gördükten sonra <a href="http://nettuts.com/tutorials/javascript-ajax/15-resources-to-get-you-started-with-jquery-from-scratch/">nettuts üzerindeki</a> benzer bir yazıyı da jQuery dersleri için yayımlamayı uygun gördüm. Bu makalede daha önce hiç jQuery üzerinde çalışmamış geliştiricilere jQery kütüphanesini öğrenmelerine olanak sağlayacak 15 kaynağı listeleyecek ve ilgili kaynaklar hakkında bilgi vereceğim. Eğer bugüne kadar bu kütüphaneye herhangi bir nedenden ötürü korkup yaklaşmamışsanız, şimdi ona yaklaşmanın tam zamanı. Ne kadar kolay olduğuna inanamayacaksınız.</p> <p><strong>jQuery de ne ola ki?</strong><br>jQuery.com'a göre jQuery hızlı ve öz bir JavaScript kütüphanesi olup HTML belgelerinizi olayları işleyebilecek, animasyonlar yürütebilecek ve web sayfalarınıza Ajax etkileşimleri dahil edebilmenizi kolaylaştırır. jQuery, bugüne kadar JavaScript yazma şeklinizi geliştirmek için tasarlanmıştır.</p> <p>Daha basit anlamı ile jQuery, daha önce 10 satır yazdığınız JavaScript kodunu iki satırda yazmanıza olanak sağlayan bir kütüphane! Geriye kalan sekiz satırın en verimli şekilde başkaları tarafından halihazırda yazıldığını ve bu kodun da JavaScript çalıştırabilen tüm modern tarayıcılarda yürütülebildiğini düşünün. Daha jQuery'i derinlemesine öğrenmeden bile zengin formlardan Flash gibi menüler oluşturabileceksiniz. Bir başka iskeleti daha öğrenmek istemiyorum demeyin. Aşağıdaki kaynaklar size bu yolda adım adım rehberlik edeceklerdir.</p> <p><strong>Neden diğerlerini değil de bu kütüphaneyi kullanmalıyım?</strong><br>Sonuç olarak bu sizin seçimiz. Her bir iskeletin (framework) kendine özgü avantajları vardır. Ancak jQuery'nin günümüzün en popüler JavaScript iskeleti olmasının ardında bazı nedenler yatıyor.</p> <p><strong>Birden fazla tarayıcı ile uyum.</strong> Her bir JavaScript ikmali sırasında web geliştiricilerinin önemli bir zamanını, geliştirdikleri betiğin farklı tarayıcılar üzerinde beklendiği gibi çalışıp çalışmadığını test etmesi beklenir. Ne şans ki jQuery kütüphanesi bu tarayıcı uyumsuzluklarını gideriyor ve geliştiricilere kendi kodları üzerinde daha fazla zaman harcayabilmelerine olanak sağlıyor.</p> <p><strong>CSS Seçicileri</strong>. CSS sözdizimlerini kullanarak, geliştiriciler halihazırda kullandıkları bilgilerini belgelerine kolayca dahil edebilirler. CSS 3 ve XPATH seçicilerinin de desteği ile, jQuery sayfanızdaki elementleri kullanmak için mükkemel bir mekanizma sunuyor.</p> <p><strong>Zincirleme</strong>. jQuery kendi metodları için "zincirleme" (chaining) adı verilen bir yöntem kullanır. Bir jQuery nesnesi üzerinde bu yöntemi çalıştırdığınız her zaman, ilgili yöntem aynı jQuery elementini çalıştırır. Bu nedenle de her bir yöntem için seçicilerinizi yeniden yazmanız gerekmez. Tıpkı ".NET" tarzındaki bir özelliği kullanarak daha küçük dosya boyutlarına sahip ve kolay okunabilen kodlar yazabilmenizi sağlar.</p> <p>Eğer merakınız iyice arttıysa, çok güzel! Hemen başlayalım.</p> <p><strong>Adım 1: Kütüphaneyi İndirin</strong><br>Bu yolculuktaki ilk durağınız kütüphaneyi bilgisayarınıza indirmek olacaktır. <a href="http://www.jquery.com/">jQuery.com</a>'u ziyaret edin ve "Download jQuery" bölümüne gidin. Listedeki bağlantılardan birine tıklayarak kütüphaneyi bilgisayarınıza indirin. Daha sonra indirdiğiniz .js dosyasını HTML belgenize dahil etmeniz gerekecek.</p> <ul> <li><strong><a href="http://css-tricks.com/new-screencast-intro-to-jquery/">CSS-Tricks.com: jQuery'e Giriş</a></strong>: Bu jQuery eğitim videosunda, CSS-Tricks websitesinden Chris Coyier, jQuery'i web sayfanıza nasıl dahil edebileceğinizi ve birkaç özelliği nasıl yazabileceğinizi gösterecek.</li> <li><strong><a href="http://www.digital-web.com/articles/jquery_crash_course">Digital-Web.com: jQuery: Başlangıç Kursu</a></strong>: Kod yazmayı bilen web tasarımcıları için jQuery'e giriş kursu.</li> <li><strong><a href="http://www.slideshare.net/simon/learning-jquery-in-30-minutes">Slideshare.net: "30 Dakikada jQuery Öğrenmek"</a></strong>: Eğer slayt gösterilerinden hoşlanıyorsanız, bu ders size jQuery kullanarak nasıl slayt gösterileri oluşturabileceğinizi ve aynı zamanda size jQuery öğretmeyi hedefliyor.</li> </ul> <p><strong>Adım 2: İlk Fonksiyonunuzu Oluşturun</strong><br>jQuery'i öğrenme aşamanızın daha ilk birkaç dakikasında kendi fonksiyonlarınızı oluşturmaya başlayacaksınız. İlk durağınız John Resig'in giriş maklesi "jQuery Nasıl Çalışır?" olmalı. Resig, web uygulamalarınız üzerinde kullanacağız pek çok kolay anlaşılır yöntemi anlatacak. Anlatacakları arasında sınıf ekleme ve kaldırma, zincirleme ve "<code>document.ready</code>" yöntemini çağırmak yer alıyor.</p> <ul> <li><strong><a href="http://docs.jquery.com/How_jQuery_Works">jQuery.com: "jQuery Nasıl Çalışır?"</a></strong>: Bu giriş makalesinde John Resig (jQuery'nin yaratıcısı) sizi animasyon oluşturmanın temellerine götürecek. Eğer jQuery'e yeniyseniz bu makaleyi kesinlikle okumanız önerilir.</li> <li><strong><a href="http://15daysofjquery.com/quicker/4/">15DaysOfJquery.com: 1. Gün</a></strong>: jQuery'nin tüm özelliklerini iki haftada kavramak gibi cesur bir girişimde bulunan "15 Days of jQuery" (jQuery ile 15 Gün) web sitesi her gün bir konuyu işliyor. Bu makalede "<code>document.ready</code>" yöntemini nasıl kullanmanız gerektiğini öğreneceksiniz.</li> <li><strong><a href="http://visualjquery.com/1.1.2.html">VisualJquery.com: "jQuery Sözlüğünüz"</a></strong>: VisualjQuery.com web sitenizi dijital sözlüğünüz olarak düşünün. Site, kullanılabilen her bir jQuery yönteminin sözdizimini ve açıklamasını içeriyor. Bu siteyi yer imlerinize eklemeyi unutmayın.</li> </ul> <p><strong>Adım 3: Elementlerinizi Canlandırın</strong></p> <p>Bu pek çok geliştirici için tartışmalı bir konudur. Birinci grupta "sıfır animasyon"da ısrar eden insanlar bulunur. Bunlar kullanıcının istediklerine mümkün olan en hızlı şekilde cevap verilmesine ve aradan çekilmesini tercih ederler. Onlara, bir sonraki uğraşı için bekleyen bir zombi gibi davranmayın. İkinci grupta da bazı insanlar vardır. Onlar, göze hoş görünen animasyonlar içeren bir siteye, kendi kullanıcıları için uygun bir site gibi bakarlar. Bu animasyonlar uygun kullanıldığında animasyonların kullanılırlığı önemli ölçüde arttırdığına inanırlar. Siz, hangi grupta olduğunuza karar vermelisiniz. Hangi grupta olursanız olun jQuery'nin sayfanızdaki elementleri hareket ettirebilme görevini mümkün olan en kolay şekilde yerine getirebildiğini unutmayın.</p> <ul> <li><strong><a href="http://docs.jquery.com/API/1.1/Effects/Animations">jQuery.com: "Animasyonlar</a></strong> jQuery'nin animasyon yeteneklerini öğrenirken burası uğramanız gereken ilk yer olmalı. Makale, bu yöntemi kullanırken ihtiyacınız olacak parametreleri detaylandırıyor.</li> <li><strong><a href="http://www.detacheddesigns.com/blog/blogSpecific.aspx?BlogId=78">Detached Designs: jQuery'nin Animasyon Yeteneklerini Öğrenmek</a></strong>: Konu animasyona geldiğinde hiç deneyiminiz yok mu? Bu makale özellikle animasyon konusunda hiç deneyimi olmayan kullanıcıları hedef alıyor. Makalenin içerdeği başlıklar arasında metin boyutunu değiştirmek, elementleri hareket ettirmek, animasyonları zincirlemek gibi her jQuery kullanan geliştiricilerin işine yarayacak konuları içeriyor.</li> <li><strong><a href="http://www.webdesignerwall.com/demo/jquery/">Web Designer Wall: Tasarımcılar İçin jQuery Dersleri</a></strong>: Halen jQuery'nin gücü kafanızı mı karıştıryor? Bu site menülerden imaj değiştirmeye kadar 10 adet örneği detaylandırarak bu muhteşem kütüphanenin yetenekleri hakkında sizi bilgilendirmeyi hedefliyor.</li> </ul> <p><strong>Adım 4: Eklentiler</strong><br>jQuery ile ilgili güzel olan bir şey var ki o da kütüphane geliştirilirken, John Resig ve ekibi kütüphanenin özelliklerini eklentiler kullanarak geliştirmenin sadece birkaç satır kod ekleyerek mümkün kılmak üzerine çalışmış olmaları. Kendinize özgü yöntemleri çok kısa süre içerisinde yazabileceksiniz! Bu eklentileri ana kütüphaneden ayrı tutarak (bu arada jQuery kütüphanesinin sadece 16KB olduğunu da hatırlatalım), bu özel eklentileri sadece gerektiği zaman sayfalarımıza dahil edebileceğiz. Bunun sonucunda JavaScript dosyalarınızın boyutu mümkün olan en küçük seviyede kalacaktır.</p> <ul> <li><strong><a href="http://methvin.com/jquery/jq-corner.html">jQuery Corner Gallery</a></strong><br>Elementlerinize <a href="http://www.kodaman.org/yazi/sizi-css3-ile-tanistiracak-5">yuvarlatılmış köşeler eklemek</a> için CSS3'ün tüm tarayıcılar tarafından desteklenmesini beklemek istemiyor musunuz? O zaman jQuery kullanarak elementlerinize kolayca yuvarlatılmış köşeler ekleyebilirsiniz. Sadece yuvarlatılmış köşeler ile de sınırlı kalmayın, zira eklenti çeşit çeşit köşe tiplerini de bünyesinde barındırıyor. Bu eklenti araç kutunuzda kalıcı bir yer bulabilir.</li> <li><strong><a href="http://enhance.qd-creative.co.uk/index.php/2008/javascript/10-useful-jquery-plugins">Kullanıcı Deneyimini Geliştirin: 10 Kullanışlı jQuery Eklentisi</a></strong> Bu makalede James Padolsey, kendince en iyi jQuery eklentilerini listelemiş.</li> <li><strong><a href="http://docs.jquery.com/Plugins/Authoring">jQuery.com: "Eklentiler"</a></strong>: Her zaman olduğu gibi jQuery.com değerli bir kaynak olmaya devam ediyor. Bu makale ilk eklentinizi oluşturmak için size adım adım rehberlik ediyor.</li> </ul> <p><strong>Adım 5: AJAX Özelliğini Dahil Etmek</strong><br>Şu ana kadar öğrendiğiniz jQuery yetenekleri ile kendinizi güvende mi hissediyorsunuz? Yeteneklerinizi bir sonraki seviyeye yükseltmeye hazır mısınız? Neden betiklerinize biraz Ajax özelliği dahil ederek başlamıyorsunuz? Her ne kadar "<code>load()</code>" ve "<code>.get()</code>" yöntemlerinin kullanımı ile jQuery veri yüklemeyi inanılmaz derecede kolaylaştırıyor. Aşağıdaki kaynaklar eğitiminiz için hayati önem taşıyor.</p> <ul> <li><strong><a href="http://www.sitepoint.com/article/ajax-jquery">Sitepoint.com: jQyery ile Kolay AJAX</a></strong>: Akash Mehta'nın Sitepoint için hazırladığı bu makalede web uygulamalarınıza AJAX eklemenin jQuery kullanılarak ne kadar da basit bir işlem olduğu anlatılıyor.</li> <li><strong><a href="http://jqueryfordesigners.com/using-ajax-to-validate-forms/">Tasarımcılar için jQuery: AJAX Kullanarak Form Doğrulama</a></strong>: Bu makalenin yazarı Remy, bizlere jQuery kütüphanesinin yanında AJAX kullanarak bizlere, web tabanlı formlara nasıl sunucu taraflı doğrulama özelliğini ekleyebileceğimizi gösteriyor.</li> <li><strong><a href="http://nettuts.com/javascript-ajax/how-to-load-in-and-animate-content-with-jquery/">Nettuts.com: jQuery Kullanarak İçerik Nasıl Yüklenilir ve Hareket Ettirilir?</a></strong>: jQuery dersleri ararken NETTUT'un "Javascript" kategorisine bir gözatmayı unutmayın. Bu derste NETTUTS ekibi jQuery kullanılarak bir verinin nasıl yüklenebileceğini ve ardından onu taşıyan elementin nasıl hareket ettirilebileceğini göstermiş.</li> </ul><p>Bu yazı <a href="http://www.bildirgec.org/uye/SawioN">SawioN</a> tarafından <a href=" http://www.bildirgec.org/yazi/size-sifirdan-jquery-ogretecek-15 ">bildirgec.org</a> adresli sitede yayımlanmak üzere yazılmıştır. Kaynak gösterilmeksizin kopyalanamaz.</p><hr>Pilli Projeleri: <a href="http://pilli.com">Pilli.com: Kolektif Bağımsız İçerik</a> | <a href="http://sosyomat.com">Sosyomat.com: Arkadaşını Etiketle</a> | <a href="http://put.io">Put.io: Online Cloud Storage</a> Sun, 11 Jan 2009 11:14:00 GMT 220421@http://www.bildirgec.org/ http://www.bildirgec.org/yazi/size-sifirdan-jquery-ogretecek-15