Category : Wordpress kodları

İnternet Dünyası Wordpress Wordpress kodları

Siteye İnstagram kodu ekleme

web.stagram

web.stagram

Merhaba arkadaşlar. Bugün ne yazsam acaba diye düşünürken bir anda aklıma İnstagram’ı ekleyeyim la Oğuz dedim. Biraz farklı olayım dedim. Diğer bloglardan. Yada diğer yazarlardan diyeyim işte.

 

Şimdi vereceğim kod ile birlikte sitenize instagram kodu ekleyebileceksiniz. İnstagramda ki resimlerinizi blogunuz da kullanabilirsiniz vereceğim kod ile 🙂

web.stagram1

Siteye İnstagram kodu ekleme

Şu adrese gidiyoruz. Daha sonrasında aşağısına inip kullanıcı adımızı yazıyor ve Generate Code(Kodu oluştur) Diyoruz. Ondan sonra  kodu Görünüm > Bileşenler bölümünden sitemize ekleyebiliyoruz.

Abi beni hiç uğraştırma direk kodu ver diyorsanız da :

<iframe src=”http://widget.stagram.com/in/bipixel/?s=100&w=2&h=3&b=1&p=5″ allowtransparency=”true” frameborder=”0″ scrolling=”no” style=”border:none;overflow:hidden;width:230px; height: 345px” ></iframe> <!– Webstagram – web.stagram.com –>

Yukarıda bulunan kodda yazan Bipixel kısmını kendi kullanıcı id’niz olarak değiştire biliyorsunuz.

Örnek olarak :

id niz Oguz diyelim

<iframe src=”http://widget.stagram.com/in/Oguz/?s=100&w=2&h=3&b=1&p=5″ allowtransparency=”true” frameborder=”0″ scrolling=”no” style=”border:none;overflow:hidden;width:230px; height: 345px” ></iframe> <!– Webstagram – web.stagram.com –>

Şeklinde olacak.

Kendinize iyi bakın :).

Yazıyı oku
Wordpress Wordpress kodları

50 Javascript Araçları ve Kaynakları

new_resources_30

50 Javascript Araçları ve Kaynakları

Merhaba sevgili tasarımcılar ! Bugün nasılsınız ? Sizler için özel bir kaç şey paylaşmak istiyorum bugün.  50+  Javascript araçları ve kaynakları paylaşmayı uygun gördüm :).

Tepki

Top 50 javascript araçları kaynaklarını 2.013 tepki

Tepki kullanıcı arabirimleri oluşturmak için Facebook’ta bir JavaScript çerçevedir.

Tepki →

AdminJS

AdminJS - Backend-Agnostik Yönetimi Çerçeve üst 50 javascript araçları kaynakları 2013

AdminJS backend ile etkileşim için bir istemci tarafı uygulama çerçevesidir.

AdminJS →

Paralaks – Hafif Paralaks Motor

Paralaks - Hafif Paralaks Motor üst 50 javascript araçları kaynakları 2013

Paralaks bir akıllı cihazın yönüne tepki basit, hafif paralaks motorudur.

Paralaks →

Web İzleme Çerçeve

Web İzleme Çerçeve - instrumenting analiz ve web uygulamaları 50 javascript araçları kaynaklarını 2013 Başa görselleştirmek için Zengin araçlar

Web İzleme Çerçeve karmaşık web uygulamaları izleme ve soruşturma için kütüphaneler, araçlar ve görselleştiriciler kümesidir.

Web İzleme Çerçeve →

Izgara Formlar

Izgara üst 50 javascript araçları kaynaklarını 2013 Formlar

A JS / CSS çerçeve, Izgara Formlar düzenli olarak girilmesi çok sayıda veri gerektiren uygulamalarda kullanılmak üzere tasarlanmış yoğun biçimleridir.

Izgara Formlar →

Hopscotch – A Ürün Turu Çerçeve

Hopscotch - A Ürün Turu Çerçeve üst 50 javascript araçları kaynakları 2013

Hopscotch kolay sayfalarında ürün turlar eklemek yapmak için bir çerçevedir. Hopscotch girdi olarak bir tur JSON nesnesini kabul eder ve tur ekran render ve tur ilerleme yönetmek kontrol etmek için geliştirici için bir API sağlar.

→ Hopscotch

Kaide

Kaide üst 50 javascript araçları kaynakları 2013

Kaideye istemci ve sunucu tarafı geliştirme dili ve onun ilkelerini hem getirmeyi amaçlıyor Clojure yazılmış bir web uygulama çerçevesidir.

Kaide →

Helios

Helios top 50 javascript araçları kaynakları 2013

Helios geliştiriciler bir istemci-sunucu uygulaması almak için izin iOS uygulamaları için gerekli arka uç hizmetleri sağlayan bir açık kaynak kodlu bir çerçevedir yukarı-ve-çalışan sadece birkaç dakika içinde.

Helios →

RoughDraft.js

RoughDraft.js 50 javascript araçları kaynaklarını 2013 Başa

Hızlı bir şekilde oluşturmak ve biçimlendirme, sunucu tarafı döngüler / kod çoğaltma veya sahte içerik (lorem ipsum text / images) kaynak kalmadan tam etkileşimli HTML mock-up prototip.

RoughDraft.js →

svg.js

svg.js top 50 javascript araçları kaynakları 2013

svg.js hiçbir bağımlılıkları ile SVG manipüle ve animasyon için hafif bir kütüphane ve mümkün olduğunca küçük olması hedeflemektedir.

svg.js →

Midway.js

Midway.js top 50 javascript araçları kaynakları 2013

Midway.js otomatik olarak kendi web sitelerinde duyarlı elemanları ortalamak için süper kolaylaştırır.

Midway.js →

Perimeter.js

haber tasarım Perimeter.js 50 javascript araçları kaynaklarını 2013 Başa

 

Perimeter.js →

Rar.js

AJAX kullanarak, Dosya API ve yerel erişim, rar.js paketlenmiş veri istemci tarafı ve sunucu tarafı ayıklamak ya da işlemek için izin, RAR formatı saf bir JavaScript uygulaması sağlar.

Rar.js →

Widearea

Widearea top 50 javascript araçları kaynakları 2013

Widearea genişletilebilir bir textarea oluşturmak ve kolayca metin geniş hacimli yazmak için hafif bir JavaScript / CSS kütüphanesidir.

Widearea →

Açısal Chart.js

Açısal Chart.js - Köşeli top 50 javascript araçları kaynaklar 2013 Basit Chart.js Sarıcı

 

Açısal Chart.js →

HTML.js

HTML.js - Bir Genişletilebilir Kütüphane Sen DOM iyi 50 javascript araçları kaynaklarını 2.013 keyfini Yardım için

 

HTML.js →

JSHint

JSHint top 50 javascript araçları kaynakları 2013

JSHint JavaScript kod hataları tespit ve ekibinizin kodlama kuralları uygulamak için bir araçtır.

JSHint →

Flatdoc

Flatdoc top 50 javascript araçları kaynakları 2013

Flatdoc Markdown dosya getirir ve tam sayfa olarak işler, küçük bir JavaScript dosyası olduğunu.

Flatdoc →

Skeuocard

Skeuocard - Kademeli javascript araçları kaynaklar 2013 bir skeuomorphic arayüz üstüne 50 kredi kartı girişlerini artırır

Skeuocard aşamalı bir skeuomorphic arayüz sağlamak için kredi kartı girişlerini artırır.

Skeuocard →

Ractive.js

Ractive.js - Yeni Nesil DOM Manipülasyon iyi 50 javascript araçları kaynakları 2013

Ractive.js düşünmenin belirli bir çerçevenin bir şekilde sizi zorlamaz bir şekilde reaktif kullanıcı arabirimleri oluşturmak için bir JavaScript kütüphanesidir.

Ractive.js →

HTML-Müfettiş

HTML-Müfettiş top 50 javascript araçları kaynakları 2013

HTML Müfettiş sizin ve ekibinizin daha iyi biçimlendirme yazmak için bir kod kalite aracıdır. Bu JavaScript ile yazılmış ve tarayıcıda çalışır, böylece HTML test kolay olmamıştı oluyor.

HTML-Müfettiş →

Basit İstatistik

Basit İstatistik 50 javascript araçları kaynaklarını 2013 Başa

Basit istatistik tanımlayıcı istatistikler, regresyon ve sınıflandırma yapan bir JavaScript kütüphanesidir.

Basit İstatistik →

Annyang

Annyang top 50 javascript araçları kaynakları 2013

annyang ziyaretçilerin sesli komutlar ile sitenizi kontrol sağlayan küçük bir JS kütüphanesi. Bu birden çok dili destekler ve hiçbir bağımlılıkları vardır.

Annyang →

favico.js

haber tasarım favico.js - Sizin Favicon üst 50 bir Kullanımı javascript araçları kaynaklar 2013 olun

favico.js →

Snap.svg

Snap.svg top 50 javascript araçları kaynakları 2013

Snap.svg JavaScript kütüphanesi jQuery DOM ile çalışma yapar gibi kolay SVG varlıkları ile çalışma yapar.

Snap.svg →

Resumable.js

Resumable.js top 50 javascript araçları kaynakları 2013

Resumable.js HTML5 Dosya API ile aynı anda birden çok istikrarlı ve resumable yüklenenler sağlayan JavaScript kütüphanesi

Resumable.js →

Sir Trevor JS

Sir Trevor JS iyi 50 javascript araçları kaynakları 2013

Bu hale nasıl hakkında bir şey öngörür değildir web içeriği için sezgisel bir editör: Sir Trevor tamamen web için yeniden hayal zengin içerik düzenleme olduğunu.

Sir Trevor JS →

gif.js

top 50 javascript araçları kaynaklarını 2013 gif.js

gif.js arka planda her kareyi render yazdığınız dizileri ve web işçileri kullanan tarayıcınızda çalışan bir JavaScript GIF kodlayıcı.

gif.js →

instano.js

instano.js top 50 javascript araçları kaynakları 2013

instano.js sayfa yüklendikten sonra JavaScript devre dışı olup olmadığını anında tespit sağlar.JS devre dışı olduğunda içindeki iletiler hemen gösterilir, böylece standart <noscript> etiketleri değiştirir.

instano.js →

Countable.js

Countable.js 50 javascript araçları kaynaklarını 2013 Başa

Sayılabilir canlı paragraf-, kelime ve karakter sayma, bir HTML öğesi eklemek için bir işlevdir.

Countable.js →

Packery

Packery top 50 javascript araçları kaynakları 2013

Packery bir bin-paketleme algoritması kullanan bir JavaScript düzen kütüphanedir. Düzenleri akıllıca sipariş veya organik vahşi olabilir. Elements ideal bir noktada uygun yerde, damgalı, ya da etrafında sürüklenebilir.

Packery →

highlight.js

highlight.js top 50 javascript araçları kaynakları 2013

Highlight.js herhangi bir web sayfasında kod örneklerinde sözdizimi vurgulamaktadır. Bu otomatik dilini algılar ve bunu vurgular.

highlight.js →

Ham

Ham top 50 javascript araçları kaynakları 2013

Ham d3.js kütüphaneye üstüne özel vektör tabanlı görselleştirme oluşturmak için açık bir web aracıdır.

Ham →

FastActive

FastActive top 50 javascript araçları kaynakları 2013

FastActive web siteleri ve web uygulamaları dokunmatik cihazlar üzerinde yerli uygulamalar gibi duyarlı hissettiren JS pasajı.

FastActive →

RulersGuides.js

RulersGuides.js top 50 javascript araçları kaynakları 2013

RulersGuides.js Photoshop benzeri cetveller sağlayan ve bir web sayfasında arayüzü kılavuzları bir Javascript kütüphanesidir ..

RulersGuides.js →

TogetherJS

TogetherJS top 50 javascript araçları kaynakları 2013

TogetherJS web işbirliği özellikleri ve araçları ekler Mozilla tarafından ücretsiz, açık kaynak Javascript kütüphanesidir.

TogetherJS →

Orta Editör

Orta Editörü top 50 javascript araçları kaynakları 2013

Vanilya JavaScript kullanılarak yazılmış, Orta Editör medium.com inline editörü araç çubuğunda bir klonu.

Orta Editör →

Küstürmek

Vex top 50 javascript araçları kaynakları 2013

Vex kolayca stylable, çok yapılandırılabilir modern bir iletişim kütüphane, ve yolumdan alır.

Vex →

Conditioner.js

Conditioner.js 50 javascript araçları kaynaklarını 2013 Başa

Conditioner.js çevre koşullarına göre yükleme ve boşaltma davranışı için Javascript kütüphanesidir.

Conditioner.js →

Stajyer

Stajyer top 50 javascript araçları kaynakları 2013

Stajyer Eğer JavaScript kütüphaneleri ve uygulamalar için tutarlı, yüksek kaliteli test durumlarda yazmak ve çalıştırmak yardımcı olmak için tasarlanmış JavaScript için tam bir test yığını.

Stajyer →

Chart.js

Chart.js top 50 javascript araçları kaynakları 2013

Tuval öğesi kullanarak basit HTML5 Grafikler.

Chart.js →

Intro.js

Intro.js top 50 javascript araçları kaynakları 2013

Intro.js projeler için bir adım-adım kılavuz ile web siteleri ve özellikleri için daha iyi tanıtımları sunuyor.

Intro.js →

Headtrackr

headtrackr bir web kamera ve WebRTC / getUserMedia standardı aracılığıyla, bilgisayar ekranına göre kafasıyla bir kullanıcı konumunu izleme, gerçek zamanlı yüz izleme ve kafa takibi için bir kütüphanedir.

Headtrackr →

Formbuilder.js

Top 50 javascript araçları kaynaklarının 2013 Formbuilder.js

Formbuilder webforms oluşturmak için bir grafik arayüz. Wufoo veya Google Formlar, ancak uygulama içine entegre edilebilir hafif bir bileşeni düşünün.

Formbuilder.js →

Superhero.js

Superhero.js top 50 javascript araçları kaynakları 2013

Superhero.js biz konuyla ilgili bulduğum en iyi makalelerin bir toplamıdır.

Superhero.js →

Yazıyı oku
Wordpress Wordpress eklentileri Wordpress kodları

WordPress temanız için demo ekleyin

theme-demo-url

Merhaba arkadaşlar. Bir başka WordPress konumuzla sizler ile beraberiz.Çoğu WordPress tema satış siteleri veyahut tema yapımcıları  temaları ön izlemek  ve kullanıcıların hem temayı görmesi,kurcalaması açısından iyi olacağı gibi öteki bir yandan da alma isteğini yerine getireceği bir demo koymaktadırlar. Peki size bu makalemizde hiç bir kod bilgisi bilmeden bu demoların aynısını sitenizde uygulayabileceksiniz desek ne dersiniz ?

WordPress Demo Bar adlı eklen timiz sayesinde yukarıda yazmış olduğumuz demo gösterme olayını hiç bir kod bilgisi bilmeden uygulayabiliyoruz. Yukarıda vermiş olduğumuz resimdeki gibi sizin için oluşturulmuş özel bir menü göreceksiniz. Bu menü aracılıyla tema satışı yaparken farklı temaları aynı alanda demolarını gösterebilecek ve müşterilerinizi etkilemenin kolay yolunu keşfedeceksiniz.

http://www.example.com/?themedemo=theme-name sizin için default olarak gelecektir.

Görüntülemek istediğiniz temanın adı ile tema-adını(theme-name) değiştirin. URL Tema Demo Bar, bir tema switcher ve kapatma düğmesi ile example.com gösterecektir.WordPress Tema Demo Bar eklentisi temalar dizinden temaların adlarını otomatik olarak alır. Bu sayede sergilemek istemiş olduğunuz demo tasarımları kendiniz kolay bir şekilde seçebilirsiniz.

Ek olarak WordPress Demo Bar adlı eklentinin size sunmuş olduğu bazı ek özelliklerde mevcuttur.

Bilindik 2 ek özelliği vardır.

  1. Download Özelliği
  2. Buy(Satın alma) Özelliği

1- Download özelliği

Özellikle tema indirme sitesi olan arkadaşların işine yarayacak bir özellik olan Download özelliği sayesinde temaya koymuş olduğunuz dizinden Download düğmesine basarak otomatik olarak temayı indirilebilir.

2- Buy(Satın Alma) Özelliği

Bir çok tema sitesi veyahut tema satıcısı arkadaşın aradığı bir özellik sanırsam. Satın alma özelliği sayesinde sizi mail ile bilgilendiriyor ve satın almak isteyen kişi ile görüşebiliyorsunuz.

Aşağıda daha iyi anlayabilmeniz için resimler mevcuttur.

 

 

theme-demo-bar-looks

 

theme-demo-url

Yazıyı oku
Wordpress Wordpress kodları

Geliştiriciler için 10 Hızlı CSS3 Kod Parçacıkları

css3-markup

Web tasarımda en önemli dillerden birisi şüphesiz ki CSS3 oluverdi. Eğer CSS3 konusunda acemi iseniz şuan tam yerindesiniz ! Sizlere bu makalemizde “Geliştiriciler için 10 Hızlı CSS3 Kod Parçacıkları” paylaşacağız. Burada vereceğimiz CSS3 kodları ile birlikte sitenizi daha iyi noktalara getirebileceksiniz.

Bugünün sizler için gerçekten harika bir liste hazırladık. İsterseniz bu harika listemize hemen geçiş yapalım.

css3-markup

Bulanık Yazı

.blur{  
color: transparent;  
text-shadow: 0 0 3px rgba( 0, 0, 0, 0.5);  
} 


Image Preloader

Resimleriniz bazen geç açılabilir. Bunun için düşünülmüş bir CSS3 kod parçacığımız :).

body:before {

    content: url(images/hover3.gif);

    display:none;

}

Gradient Yazı

Bu webkit yardımıyla günümüzde artık Gradient Yazı elde edebilirsiniz.

h1 { 
  font-size: 20px; 
  background:-webkit-lineer-gradyan (# eee, # 333); 
  -webkit-background-klip: Metin, 
  -webkit-text-fill-color: transparent; 
}

Resim Saydamlık

IE9, Firefox, Chrome, Opera ve Safari için uyumludur. 1.0 – Saydamlık özelliği 0.0 arasında bir değer alabilir. Daha düşük bir değer daha saydam yapar. IE8 ve daha önceki sürümler için filtre kullanın: alpha (opacity = x). 100 – x 0 arasında bir değer alabilir. Daha düşük bir değer daha saydam yapar.

img { 
donukluk: 0.4; 
filtresi: alpha (opacity = 40); IE8 için / * ve * / daha önce 
}

Çoklu Arka

CSS3 sayesinde birden fazla arka plan kullanmak isteyenlerin bir numaralı minik kod parçacığı :).

#Multiple-Backgrounds {
width: 500px;
height: 250px;
background: url(decoration.png) left top no-repeat, url(ribbon.png) right bottom no-repeat, url(old_paper.jpg) left top no-repeat;
}

Metin Gölgesi

CSS3 ile metin gölgesi efekti vermeniz mümkün :). Tasarımlarınızı daha vazgeçilmez yapmaya ne dersiniz ?

text-shadow: 2px 2px 2px # 000;

Bağlantı Sözde Sınıflar

Bağlantılar CSS destekleyen tarayıcı farklı şekillerde görüntülenebilir:

a:link {color: blue;} /* unvisited link */
a:visited {color: purple;} /* visited link */
a:hover {color: red;} /* mouse over link */
a:active {color: yellow;} /* selected link */

Yuvarlak Köşeler

CSS3 ile birlikte gelen özelliklerden birisi buda. Siteyi optimize etme konusunda yararı oluyor.

#roundedcorners {
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px; /* future proofing */
-khtml-border-radius: 10px; /* for old Konqueror browsers */

}

@ Font-face kullanımı

Web sitelerde en büyük sorunlardan birisi de fontlardır. Bu sorunu artık @font face kullanımı ile aşmanızı tavsiye ediyoruz.

@font-face {
 font-family: 'MyWebFont';
 src: url('webfont.eot'); /* IE9 Compat Modes */
 src: url('webfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
      url('webfont.woff') format('woff'), /* Modern Browsers */
      url('webfont.ttf')  format('truetype'), /* Safari, Android, iOS */
      url('webfont.svg#svgFontName') format('svg'); /* Legacy iOS */
 }

IE kaydırma textarea Kaldır

Internet Explorer taşan metin alanları beni deli etmeye başladı ! Buna çözüm olarak ise bu kod parçacığını kullanmanızı tavsiye ederiz :).

textarea {

overflow:hidden;

}
Yazıyı oku
Wordpress Wordpress kodları

WordPress Yönetici Bar gizlemek

wordpressadminbargizleme

wordpressadminbargizleme

Merhaba arkadaşlar. Sizlere bu makalemizde WordPress Yönetici Bar gizlemeyi göstereceğiz.

WordPress otomatik olarak kullanıcılar giriş için sayfanın üst kısmında bir yönetici araç çubuğu enjekte eder. İşte görüntülenmesini bu araç çubuğu engelleyecek bir kod parçası var:

add_filter ('show_admin_bar', '__return_false');

Yukarıda ki kod parçacığı ile birlikte sıkıcı yönetici barını gizleyebilirsiniz. Tabii bu sizin tercihinize kalmış bir olay. Çoğu kişi ise yönetici barı ile birlikte kullanmayı seviyor.

 

Sizlere bu makalemizde WordPress Yönetici Bar gizlemeyi gösterdik :). Bir sonraki WordPress kodları kategorisinde bulunacak yazımızda görüşmek üzre :).

Yazıyı oku
Wordpress Wordpress kodları

WordPress yorum bölümündeki kodları kaldırmak

WordPress yorum bölümündeki kodları kaldırmak

WordPress yorum bölümündeki kodları kaldırmak

Birçoğumuz sitelerimize özen gösteririz ancak sitelerimize gösterdiğimiz özenlere rağmen bir türlü

başarılı olamamakla kendimizce yakınırız. Başarılı olan sitelere bakarız onlardan bir şeyler kapmaya

çalışırız, bazen size başarılı ve belli bir kitleyi yakalayıp büyük hitler yapan siteler sizin için büyük

hatalar yapabilir. Ancak bu hatalar ile nasıl halen uzun süreli başarılar el de ettiklerini anlayamazsınız.

Özellikle wordpress olan sistemler de bu oldukça bol gözükmektedir. Çünkü wordpress sisteminin

arama motoru optimazyonu tamamen küçük ayrıntılara saklanmıştır. Küçük ayrıntılara saklandığı

kadar da wordpress birçok seo eklentisi ile çevrelenmiş, yaklaşık 500 tane seo eklentisi ile

itibarlanmış, otomatik bir sistemdir. Bu sisteme göre seo ne kadar basit görünse de Google’un gelişen

algoritmalarından dolayı wordpress sistemleri bile bu ince ayarlamalardan etkilenmiş ve bazı şeylerin

dikkate alınması şart olmuştur. WordPress de özellikle hiç beklemediğiniz bölümlerden arama motoru

optimazyonu puanınız çok rahat bir şekil de kırılabilir, onun için sitemizi en iyi şekil de optimize edip

ziyaretçileri yönünden bakarak kullanıcılara teslim etmek zorundayız.

WordPress ince ayrıntılar ile seo yönünde ilerler iken birden karşımıza bir kod çıktı. Bu kod özellikle

yeni kurulan tüm wordpress siteler de birebir bulunmaktaydı. Bazen wordpress temaları ile de

gelebiliyordu. Bu kod şu şekildedir: <a href=”” title=””> <abbr title=””> <acronym title=””> <b>

<blockquote cite=””> <cite> <code> <del datetime=””> <em> <i> <q cite=””> <strike> <strong>

Kodu Kaldırma Yöntemleri:

1- Temanın style.css dosyasının en altına şu kodu eklemek:

.form-allowed-tags {display:none;}

2- Tema da bulunan single.php dosyasında Allow tags kod yapısını aratıp kod yapısını tamamen

kaldırmak

3- Kendi bizzat kullandığım yöntemdir. Garanti ve kesin çözümdür.

Ftpye bağlanıyoruz. Wp-includes’e girip comment-template.php dosyamızı indirip açıyoruz.

1539. Satırı açıp şu alttaki kodları silip bitiriyoruz.

‘comment_notes_after’ => ‘

‘ . sprintf( __( ‘You may use these <abbr title=”HyperText Markup

Language”>HTML</abbr> tags and attributes: %s’ ), ‘ <code>’ .

allowed_tags() . ‘</code>’ ) . ‘

‘,

Yazıyı oku
1 2 3