27 views

İlk olarak kullanmak istediğiniz fontu ayarlayın. Sevdiğiniz, tasarıma uygun bir font belirledikten sonra aşağıdaki CSS kodları ile fontumuzu nasıl kullacağımıza bir bakalım.

@font-face {
font-family: ‘elma’;
src: url(‘fonts/fontadi.otf’);
}

font-family: ‘elma’; Burada belirleyeceğimiz CSS kodları arasında fontumuzu nasıl çağırmak istiyorsan o isimi veriyoruz. Mesela h1 içerisinde bu @font-face özelliğini kullanmak istiyorsak h1′in fontunu şu şekilde belirlememiz gerekir; font-family:’elma’;

src: url(‘fonts/fontadi.otf’); Burada ise sayfamıza bir resim eklediğinizi düşünün. Resimi images klasörüne eklersiniz değil mi? Aynın onun gibi fonts adında bir klasör oluşturun ve fontunuzu o klasörün içerisine ekleyin. Fontu klasörden çağırırken debu şekilde çağırmanız gerekir.

Biz örnek olması açısından h1 içerisinde kullanalım. h1 kodları iseaşağıdaki gibi olmalıdır:

h1 {
font-family:”elma”;
}

h1 ve @font-face kodlarımızı yazdıktan sonra fontumuzu html kodlarımızın içerisinde kullanabiliriz. H1 içerisinde her hangi bir cümle yazarak ve sayfanıza yukarıdaki CSS kodlarını ekleyerek çalışmanızı test edebilirsiniz.

Benim hazırladığım örneğin kodları ve ekran görüntüsü aşağıdaki gibidir. Kullandığım font ise GoodDog. Fontu buradan indirebilirsiniz.

52 views

Facebook gelişmeye ve yenilenmeye devam ediyor. En son yeniliklerinden birisi de Facebook Timeline. Facebook Timeline için kısaca şöyle diyebiliriz; Facebook’a üye olduğunuz andan itibaren bütün yaptığınız her şeyi tarihi bir sıraya göre profilinizde görüntülenmesidir. Bu işlem yapılırken profilinizin de görüntüsü değişiyor. Daha farklı ve alışılmadık profile sahip oluyorsunuz.

Facebook Timeline özelliğini nasıl kullanabilirim?

Bunun için Orçun‘un yazdığı yazıya kısaca bir göz atabilir ya da İngilizce içerikli olarak da buraya bakabilirsiniz. Özetlemek gerekirse; kendi çapınızda ufak bir uygulama oluşturuyorsunuz ve onun sayesinde profilinizde Facebook Timeline aktif olmuş oluyor. Eğer ki profilinizin yeni görünümünü beğenmezseniz buraya giderek oluşturduğunuz uygulamaları silin ve profiliniz eski haline dönsün.

Facebook Timeline ile ilgili bir video

132 views

20 Eylül 2008’de açılan renkli teneke bugün 3. yaşını kutluyor. Daha çok web tasarım, programlama konuları üzerinde yazıların bulunduğu bu blogun bir çok kişiye yardımcı olduğunu düşünüyorum.

Son zamanlarda her ne kadar blog ile ilgilenip yeni yazılar yazamasam da içimde hep yazı yazma isteği var ama vakit bulamıyorum pek.

Sizlerin şimdiye kadar yapmış olduğu güzel yorumlarınız, tebrikleriniz için çok teşekkür ediyorum. “Şu konuyu da anlatsanız güzel olur” ya da “şu sorunu nasıl çözebilirim” gibi önerilerinize de her zaman açığım. Sonuçta bu bloh herkese yardımcı olabilmek için açıldı.  Sorularınızı güzel bir yazı olarak paylaşarak aynı sorulara sahip kişilere de faydamız olabilir.

Renkli teneke blogumuzun doğum günü kutlu olsun ve nice güzel yazılarla dolu senelere hep birlikte ulaşmamız dileğiyle.

46 views

Bildiğiniz gibi jQuery ile çeşitli slider çalışmaları yapabiliyorsunuz. Fotoğraflarla, yazılarla, hem yazı hem fotoğraflarla falan çeşitli çalışmalar ortaya çıkabiliyor. Ben size bu yazıda biraz daha (hatta çok kolay) kolay bir şekilde jQuery ile slider hazırlamanın küçük bir yolundan bahsedeceğim.

Bahsettiğim şey aslında bir program. WOW Slider aslında ücretsiz bir program yapılmış. Programı ücretsiz olarak bilgisayarınıza indirip kullanabilirsiniz.

Kısaca WOW Slider jQuery Slider programınn bir kaç özelliği:

• İstediğiniz kadar fotoğraf ekleyebilirsiniz.
• Geçiş efektlerini var olanlar arasından seçebiliyorsunuz.
• Görüntülenme süresini ayarlıyorsunuz. Mesela her fotoğraf 3 saniye görüntülensin gibi.
• Flickr, Picasa, Photobucket gibi fotoğraf sitelerinden slider için birkaç tıklama ile fotoğraf ekleyebiliyorsunuz.
• Direkt kendi bilgisayarınıza yayınlayarak, istediğiniz gibi değiştirip kullanabilirsiniz.
• Var olan bir html, php, asp vs sayfanızın bir bölgesine ekleyebiliyorsunuz
• Direkt bir server’a bağlanarak oraya yükleyebiliyorsunuz.
• Joomla modülü haline getirebiliyorsunuz.
• Ve daha bir çok güzel özelliği var programın.

406 views

Aslında tamamen benim gevşekliğim ve ilgilenmememden dolayı kaynaklandı bunlar. Biraz daha üzerine düşebilseydim daha güzel olurdu bu boşa geçen 4-5 ay. Şimdi tema ve diğer şeylerle yavaş yavaş ilgileneceğim. Siteyi yavaşça düzene sokup kaldığımız yerden devam edeceğiz.

Bu arada herkese bu uzun aradan dolayı gerçekten çok özür diliyorum.

74 views

Sağ üst köşede yazılı olan “NEW!” yazısını kaldırabilir, sağ ve sol okları kaldırabilir ve hatta isterseniz (biraz jquery bilgisiyle) slaytın altında ki noktaları da kaldırarak kullanabilirsiniz. Slaytta yer alan fotoğraflara isterseniz bağlantı da ekleyebilirsiniz.

Oldukça şık ve çekici bu slideshow’un ana sayfası burası. İndirmek için kendi sayasına gidebilirsiniz. Kendi sayfasında demosu mevcut. Her ihtimale karşı ben bloguma da yükledim dosyaları. Gerekli dosyaları buradan indirebilirsiniz.

185 views

İngilizce öğreniyor ve konuşmanızı geliştirmek mi istiyorsunuz? İşte bu yazı tam size göre. Gramer bilenler, bol bol kelime ezberleyenler sizinde kulak vermesi gereken bir konu bu. Herkesin yurtdışına giderek İngilizce öğrenme şansı malesef yok. Bahsedeceğim site ile yurtdışına gitmeden onların söylediklerini söylemeye çalışarak konuşmanızı geliştirebilirsiniz. Tek kelime ile mükemmel bir site. Sitede bol bol video bulunuyor. Bu viedolar Easy, Medium ve Hard olarak 3 ayrı kategoriye ayrılmış durumda. Kendi seviyenize göre seçim yapabilirsiniz. Şuanda 14 farklı kategori de mevcut. Kısaca İngilizce konuşma pratiği yapmanızı sağlayacak tonlarca video var bu sitede.

Fazla lafı uzatmadan sizi o mükemmel site ile tanıştırayım. İşte karşınızda: English Central. Sitenin bir de demo sayfası mevcut(videolar üzerinde nasıl çalışacağınızı anlatıyorlar). Buradan ulaşabilirsiniz.

174 views

960 GS‘den bahsetmek istiyorum biraz. Bilenler, duyanlar vardır elbet bunu fakat oturup da bu 960 GS’nin nasıl çalıştığını anlatan yoktu ben burada görene kadar. İzlen Öğren sitesinin blogunda yer alan bir kaç videodan bahsedeceğim size. Sitede şuanda 3 farklı video ile Dreamweaver ve 960gs ile Çalışmak başlığı ile eğitim videoları başlamış durumda. Birinci, ikinci ve üçüncü videoları izleyerek 960 GS hakkında başlangıç seviyesinde bilgi edinebilirsiniz. Videolar oldukça eğitici. Aslında videolarda size bir yol gösteriliyor ve o yolda baya bir ileriye gitmek de sizin hayal gücünüze bırakılıyor.

Videoları izlemenizi ve devamını beklemenizi öneririm. (Umarım devamı daha profesyonelce çalışmalar oluşturmamıza neden olur.) Aynı zaman da sitede başka konularda da video destekli eğitimler mevcut.

204 views

CSS3′ün bazı yeniliklerini uygulayarak görebiliyor ve istediğiniz gibi bu yeniliğin kodunu alıp kullanabiliyorsunuz. İlk önce CSS özelliğini seçiyorsunuz, ortada o özelliği üzerinde uygulayacağınız bir önizleme alanı çıkıyor. Oradan önizlemeyi görebilirsiniz. En sağda da ortada ki önizlemeye ait kodlar bulunuyor. Onları kullanabilirsiniz.

CSS3 Maker sitesi gibi “hazır kod üreteci” gibi kullanılmak üzere hazırlanmış bir çok web sitesi var. Bu tarz siteler, siz kod yazarken sizin hızlanmanızı sağlar. Faylanmanız sizin yararınıza olur.

68 views