Forum'da ara:
Ara


Yazar Mesaj
Mesaj28.11.2016, 03:31 (UTC)    
Mesaj konusu: Mobil Uyumlu Tema Yapacak var mı?

Arkadaşlar sitemin son zamanlarda mobilden girenlerde artış olduğu için mobil uyumlu tema düşünüyorum

Bedava sitemde Mobil Tasarımı aktifleştirdim. Bunun haricinde tema için bir kodlama mı gerekiyor.Bu kodlarda bilgim olmadığı için soruyorum.Korka korka zar zor mobil temada renkleri falan seçtim.Destek verebilecek olan var mı.? Yoksa bu şekilde olması da yeterli mi?
______________
Mesaj28.11.2016, 03:37 (UTC)    
Mesaj konusu:

Bdava sitem Tasarım bölümünde yaptığım ayarlamalar ile şu şekilde görünüyor


______________
Mesaj28.11.2016, 09:25 (UTC)    
Mesaj konusu: Cidden

Cidden banada lazım arkadaşlar yardımcı olur musunuz?
______________

Mesaj02.12.2016, 12:31 (UTC)    
Mesaj konusu:

Bedava Sitem Mobil Temanın ilgili ID ve CLASS etiketleri şunlardır. Bu etiketleri kullanarak BS mobil tasarımı özelleştirebilirsiniz. İlgili CSS kodlamalarınızı Tasarım > Mobil Tasarım > Bir alt sayfanın içerik metni (örneğin CSS kodu kullanılabilir) bölümüne yerleştirmelisiniz. Etiketler şunlardır:

.ui mobile .ui header { } İsminden de anlayacağınız üzere en üstteki menü ve sitenin isminin de yer aldığı yatay alan.
.ui-footer-fixed { } Yine isminden de anlayacağınız üzere en alttaki bazen reklamların yer aldığı yatay alan.
.ui-body-c { } veya .ui-overlay-c { } Mobil tasarımın vücudu, yani sıklıkla arkaplanı boşlukları ayarlamak için kullanılan etiket.
.ui-content { } Mobil tasarımda sayfa içeriklerinizin yer aldığı alan.
#nav-panel { } Sol taraftaki menü panelinin etiketi.
.ui-link-inherit { } Menüde yer alan linkler için düzenleme yapabileceğiniz etiket.
#add-form { } Sağ taraftaki + butonuna tıklayınca açılan alan.

İyi çalışmalar.
______________
Mesaj24.05.2017, 21:27 (UTC)    
Mesaj konusu:

slobada yazmış:
Bedava Sitem Mobil Temanın ilgili ID ve CLASS etiketleri şunlardır. Bu etiketleri kullanarak BS mobil tasarımı özelleştirebilirsiniz. İlgili CSS kodlamalarınızı Tasarım > Mobil Tasarım > Bir alt sayfanın içerik metni (örneğin CSS kodu kullanılabilir) bölümüne yerleştirmelisiniz. Etiketler şunlardır:

.ui mobile .ui header { } İsminden de anlayacağınız üzere en üstteki menü ve sitenin isminin de yer aldığı yatay alan.
.ui-footer-fixed { } Yine isminden de anlayacağınız üzere en alttaki bazen reklamların yer aldığı yatay alan.
.ui-body-c { } veya .ui-overlay-c { } Mobil tasarımın vücudu, yani sıklıkla arkaplanı boşlukları ayarlamak için kullanılan etiket.
.ui-content { } Mobil tasarımda sayfa içeriklerinizin yer aldığı alan.
#nav-panel { } Sol taraftaki menü panelinin etiketi.
.ui-link-inherit { } Menüde yer alan linkler için düzenleme yapabileceğiniz etiket.
#add-form { } Sağ taraftaki + butonuna tıklayınca açılan alan.

İyi çalışmalar.

@slobada
bilgiler için tşk ederim ama kodlamadan fazla anlamıyorum. yardımcı olabilirmisin.
Sitemde ana sayfadaki haber bandı görselleri kocaman çıkıyor. bir kodla sanırım bu mobil boyuta dönüşebiliyor olmalı Rolling Eyes ayrıca yukarıda verdiğin kodu nasıl kullanacam örnek bir kodlama yazabilirmisini
______________


En son isacotur tarafından 24.05.2017 21:28:56 tarihinde değiştirildi, toplam 1 kere değiştirildi
Mesaj27.05.2017, 11:43 (UTC)    
Mesaj konusu: Cevap

Responsible tasarım işinizi görecektir. İnternetten Responsible tasarımlar bulun ve onları kullanin. Mesela benim sitem olan http://toosocial.tr.gg Responsible yani mobile otomatik uyumlu. Girip bakabilirsiniz.
Mesaj28.05.2017, 09:05 (UTC)    
Mesaj konusu: Re: Cevap

hey-games yazmış:
Responsible tasarım işinizi görecektir. İnternetten Responsible tasarımlar bulun ve onları kullanin. Mesela benim sitem olan http://toosocial.tr.gg Responsible yani mobile otomatik uyumlu. Girip bakabilirsiniz.


toosocial güzel bir site olmuş ama her şeyi senin yapman lazım Smile Onun yerine forum eklentisini düzenleyip benzer bir şeyler yapabilirsin.İyi çalışmalar!
______________
Mal sahibi , mülk sahibi
Nerede bunun ilk sahibi
Mal da yalan mülk de yalan
Var biraz da sen oyalan...
Yunus Emre

Mesaj28.05.2017, 10:05 (UTC)    
Mesaj konusu:

isacotur yazmış:
slobada yazmış:
Bedava Sitem Mobil Tema ile ilgili CSS kodlamalarınızı Tasarım > Mobil Tasarım > Bir alt sayfanın içerik metni (örneğin CSS kodu kullanılabilir) bölümüne yerleştirmelisiniz.

bilgiler için tşk ederim ama kodlamadan fazla anlamıyorum. yardımcı olabilirmisin.
Sitemde ana sayfadaki haber bandı görselleri kocaman çıkıyor. bir kodla sanırım bu mobil boyuta dönüşebiliyor olmalı Rolling Eyes ayrıca yukarıda verdiğin kodu nasıl kullanacam örnek bir kodlama yazabilirmisini


Haber bandı etiketini kullanarak, görsellere bir genişlik ataması yapabilirsin. Örneğin haber bandı görsellerin şu şekildeyse:
Kod:
<div class="haberbandi">
<img src="...">
Kod:
.haberbandi img{width:100%}
gibi bir kodlama yazabilirsin. Bu, site mobil tasarımla açıldığında görsellerin pencereye tam yerleşmesini sağlayacaktır. Yukarıda verdiğim kodları da bu şekilde kullanabilirsin. Örneğin
Kod:
.ui-content{width:95%;background:#ecf0f1}
şeklinde bir kodlama mobil sayfa içerik bölümünün 95% ekran genişliğinde ve beyaz arka plan ile açılmasını sağlar.
______________
Mesaj28.05.2017, 17:11 (UTC)    
Mesaj konusu:

@slobada destek için tşkler
dediklerini anladığım kadarıyla yaptım ama beceremedim sanırım Crying or Very sad

amacım siteme mobilden girenler özellikle ana sayfada üstte bulunan haber bandı kocaman duruyor bunun otomatik küçültmek için aşağıdaki resimde olan yere ne eklemeliyim

______________
Mesaj28.05.2017, 17:56 (UTC)    
Mesaj konusu:

ana sayfadaki yatay haber bandı kodu aşağıdaki gibi
Alıntı:
<script type="text/javascript" src="http://img5.xooimage.com/files/d/e/5/jquery-2--f80ba5.js"></script><script type="text/javascript" src="http://img25.xooimage.com/files/c/d/0/easyslider1.5-11fb25a.js"></script><script type="text/javascript">
$(document).ready(function(){
$("#slider").easySlider({
controlsBefore: '<p id="controls">',
controlsAfter: '</p>',
auto: true,
continuous: true
});
$("#slider2").easySlider({
controlsBefore: '<p id="controls2">',
controlsAfter: '</p>',
prevId: 'prevBtn2',
nextId: 'nextBtn2'
});
});
</script><style type="text/css">
img{border:none;} #container2{ margin:0 auto; position:relative; text-align:left; widt700px; background:#fff; margin-bottom:2em; } #content2{ position:relative; } /* Easy Slider */ #slider{} #slider ul, #slider li, #slider2 ul, #slider2 li{ margin:0; padding:0; list-style:none; } #slider li, #slider2 li{ /* define width and height of list item (slide) entire slider area will adjust according to the parameters provided here */ width:700px; height:250px; overflow:hidden; } #slider2 li{ background:#f1f1f1; } #slider2 li h2{ margin:0 20px; padding-top:20px; } #slider2 li p{ margin:20px; } p#controls, p#controls2{ margin:0; position:relative; } #prevBtn, #nextBtn, #prevBtn2, #nextBtn2{ display:block; margin:0; overflow:hidden; text-indent:-8000px; width:60px; height:75px; position:absolute; left: 0px; top:-160px; } #nextBtn, #nextBtn2{ left:635px; } #prevBtn a, #nextBtn a, #prevBtn2 a, #nextBtn2 a{ display:block; width:60px; height:75px; background:url('http://www.imgim.com/manseti_sola_kaydir.png') no-repeat 0 0; } #nextBtn a, #nextBtn2 a{ background:url('http://www.imgim.com/manseti_saga_kaydir.png') no-repeat 0 0; } /* // Easy Slider */</style>
<div id="container2">
<div id="content2">
<div id="slider">
<ul>

sonrasında resim bilgileri var
______________


En son isacotur tarafından 28.05.2017 17:57:34 tarihinde değiştirildi, toplam 1 kere değiştirildi
Mesaj28.05.2017, 18:32 (UTC)    
Mesaj konusu:

Bu arada benim sorun çözüldü responsive tasarıma geçtim (6 ay önce Slobada sağolsun)
______________

Mesaj31.05.2017, 19:35 (UTC)    
Mesaj konusu:

Merhaba İsaCotur. Eğer kodu doğru kopyalamışsan, kod içinde genişlikle ilgili bir yazım sorunu var. Şöyle ki:
Kod:
<style type="text/css">
img{border:none;} #container2{ margin:0 auto; position:relative; text-align:left; widt700px;
widt700px; şeklinde yazılan tanımlama aslında width: 700px; şeklinde yazılmış olmalıydı. Soruna gelecek olursak gerekli açıklama aslında kod içinde kodun yazarı tarafından yapılmış:
Kod:
 #slider li, #slider2 li{
/*define width and height of list item (slide) entire slider area will adjust according to the parameters provided here*/
  width:700px; height:250px;...
Açıklama satırında slaytın genişlik ve yükseklik değerlerinin #slider li, #slider2 li ID'leri kullanılarak ayarlandığı belirtilmiş. Yani eğer medya sorguları ile uğraşmak istemiyorsan, bu ID'lere 100% genişlik değeri vererek görselleri ekrana tam oturtabilirsin. Yalnız bu durumda ek olarak 700px genişliği olan ana yapıyı #container2 ve left:635px gibi pozisyon tanımları yapılmış olan #nextBtn gibi bölümleri de tekrar düzenlemen gerekecektir. Umarım bu bilgiler ne yapacağını anlaman konusunda biraz açıklayıcı olmuştur.
______________
Mesaj09.06.2017, 14:38 (UTC)    
Mesaj konusu:

Reponsive tasarım enterge edip kullanabilirsin.
______________
>Charles Manson: ''Bana yukarıdan bakarsanız aptalın tekini görürsünüz. Bana aşağıdan bakarsanız Tanrı'yı görürsünüz. Bana tam karşıdan bakarsanız kendinizi görürsünüz... "

Bedava-Sitem Türkiye Grafikeri, Moderatörü
Iletişim: Zarathos.1881( at )gmail.com
Instagram: Zarathos.GG


Mesaj09.06.2017, 15:10 (UTC)    
Mesaj konusu:

Google'a responsible css themes yazarsan entegre edebileceğin temalar karşına çıkabilir.
Mesaj02.06.2019, 11:01 (UTC)    
Mesaj konusu: Responsive veya Bootstrap tercihi

Responsive veya bootstrap temaları tercih edebilirsiniz. Özellikle bootstrap temaları mobil ile %100 uyumlu oluyor. Free css templates sitesinden veya uipasta sitesinden temalara ulaşabilirsiniz. Eğer temaları bedava sitem'e dönüştüremiyorsanız size yardımcı olabilirim...
______________
Geri Geldim Very Happy
Önceki mesajları göster:   


Powered by phpBB © 2001, 2005 phpBB Group
Türkçe Çeviri: phpBB Türkiye & Erdem Çorapçıoğlu