SMF 2.1 BETA 3 Alt Bölümler Kategori içinde

[tekyürek]

bu  mod sayesinde  Alt Bölümler Kategori içine alabilirsiniz


admin panel  den görüntü ön izleme

[SercaN]

Responsive görünüm için neler yapabiliriz

[candidosa2]

Yes done
Thank you

[fabak]

Responsive görünümü sorunlu.. başlıklar çok daralıyor..

[tarantula901]

Hatalı kısmı resim olarak ekleyin bakalım.

[fabak]

başlıklar alta doğru uzuyor. resim ekledim. böyle olunca kaldırdım..

[tarantula901]

sitenizde sorun göremedim hangi cihazdan giriş yaptınız siteye.

bu arada 2.1 suan test aşamasında olduğu için sorun olma ihtimali mevcut aklınızda bulunsun.

[tekyürek]

Mobil icin inceliyecegim modu musait olunca

[fabak]

Mobil icin inceliyecegim modu musait olunca

Takipteyim..

[fabak]

Responsive görünüm düzenlemesi yapıldı mı

[tekyürek]

Zamanim yok pc ye gecemiyorum bile  malesef kendi siteme konu bile acamiyorum

[tekyürek]

mobilde ortalamak için

responsive.css de

bul :

Kod Seç Genişlet

/* I have a Lumia with 480px screen... so ^^ */
@media (max-width: 480px) {
/* This is general */

altına ekle

Kod Seç Genişlet

.smalltext, tr.smalltext th {
    height: auto;
    padding: auto;
   margin-left: auto;
    margin-right: auto;
width: auto;
text-align: center;
 
}

[fabak]

Maalesef bu responsive görünümü olmadı. mod, table yapısı üzerine yapılmış. masaüstü görünüm için gayet iyi. ama mobilde alt bölümler çok dar. bence şöyle yapılmalı; mobil görünüm için alt bölümleri alt alta sırala gibi basit bir <br/> kodu ile sorun tamamen çözülebilir. Yani masaüstü görünümde ikili göster, ama mobilde altbölümler alt alta sıralansın. hatta aşağıda verdiğim kod işe yarayabilir. Çok iyi bilgim olmadığı için benimki tavsiye. Ustalar işini bilir..

Kod Seç Genişlet

$mobile_agents = '!(tablet|pad|mobile|phone|symbian|android|ipod|ios|blackberry|webos)!i';
if (preg_match($mobile_agents, $_SERVER['HTTP_USER_AGENT'])) {

       echo '  mobil ise  ';
}

else
{
  echo '   masaüstü ise  ';
}

[tekyürek]

Mobilde gizlesek olmazmi alt bolumleri ?

[tekyürek]

Sitenin ismini ver bana bi   egerki mumkunse ftp yide ver pc ye gecince bakayim bi

[tarantula901]

Normal modun ayarlarını 2 sıralı ayarlayarak kontrol edin mobilden hangi modu kullanıyordunuz.

[fabak]

Mobilde gizlesek olmazmi alt bolumleri ?

öyle bir kod da mantıklı, ama en azından eskisi gibi gözükse daha iyi. alt bölümler olsa iyi olur...yani masaüstü görünümünde 2"li, mobilde eskisi gibi default(paragraf yazısı gibi peş peşe) gözükecek..

[tekyürek]

mobilde gizlemek  için


responsive.css de

bul :

Kod Seç Genişlet

/* I have a Lumia with 480px screen... so ^^ */
@media (max-width: 480px) {
 /* This is general */

altına ekle

Kod Seç Genişlet

.smalltext, tr.smalltext th {
display: none;
}
  


mobilde alt katogoriler gözükmez  ekranı yan cevirince gözükür bu şekil

[fabak]

önceki mesajda gönderdiğim mobil - masaüstü kodlarını kullanarak kendim bir şeyler yaptım. ortaya gayet güzel bir şey çıktığını düşünüyorum. Aşağıda görüntü ekledim.
Sonuç olarak ne yaptım:
Mobilde alt bölümler tek sıra (alt alta sıralı),
Masaüstünde yan yana ikili sıralı...

Sadece küçük bir css sorum olacak. Aslında çok uğraştım bir türlü olmadı. Zor olanı yaptım ama basit olanı halledemedim.
Resimde gösterdiğim gibi Masaüstü görünümde -alt bölüm başlıkları uzun olunca- alt satıra geçiyor. Sığmayınca 3 nokta olarak yarıda kesilmesi için ne yapmam gerekir?
Smf'de bu özellik resimde 1 numaralı yerde gösterdiğim gibi zaten var. Bunu alt bölüm başlıklarına da uygulamak istiyorum. Mesela resimde 2 numaralı yerde gösterdiğim Uzun olan alt bölüm başlığını 3 nokta ile sınırlandırmak nasıl oluyor?

[gecitli]

Cssââ,¬â,,¢de geniş yazıyı üç nokta ile sınırlandırmak

Bazı durumlarda gelen verinin uzunluğu bilinmediği için css ile belli bir genişlik verip taşan kısımları üç nokta koyarak kısaltmamız gerekiyor. Bu gibi durumlar için cssââ,¬â,,¢de text-oveflow özelliğini kullanıyoruz. ellipsis değeri bize bu görevi sağlıyor. Ancak taşanların gizlenmesi için ve yazının hiçbir zaman 2. satıra inmemesi için oveflow ve white-spcae özellikleri de bize lazım. Örnek vermek gerekirse;

Kod Seç Genişlet

<div>test ne kadar uzun bir yazı..</div>
Bunu kısaltmak istediğimizde yapmamiz gereken

Kod Seç Genişlet

div {
    width: 60px;
    overflow: hidden; /* taşanları gizle */
    white-space: nowrap; /* alt satıra hiç inme */
    text-overflow: ellipsis; /* eğer uzunsa üç nokta koy */
}

[fabak]

bunu dün gece çok defa denedim ama olmadı. bir yerde hata yapıyorum ama bulamadım..
index css'nin en altına dediğiniz kodları ekledim. div'e bir ad verdim. sonra BoardIndex.template.php 'de 3 nokta ile bitmesini istediğim yeri div içine aldım. ama olmadı. nerde yanlış yapıyorum?

BoardIndex.template.php 'de alt bölümleri ikili sıralayan kodu altta verdim. div kodu nereye konulmalı. biraz daha açık yazar mısınız?

Kod Seç Genişlet

global $modSettings;
if (empty($modSettings['hhyaltbolum']) || $modSettings['hhyaltbolum'] == 0)
{
echo '
<table style="float:right; padding-left:1px;" width="100%" cellspacing="0" cellpadding="3" border="0">
<tr>';
$child_counter = 0;
echo '<td style="width:50%" class="smalltext" valign="top">';
for (; $child_counter < ceil(count($children)/2); $child_counter++)
echo $children[$child_counter], '<br />';
echo '
</td>
<td style="width:50%" class="smalltext" valign="top">';   
for (; $child_counter < count($children); $child_counter++)
echo $children[$child_counter], '<br />';
echo '
</td>
</tr>
</table>';
}


[gecitli]

profildeki siteyi baz alarak yaziyorum index.css de uygun bir yere ekleyin gelci div icine tabela td eklemek ne kadar mantikli? ayri mesele ben merakinizi gidermek icin kodu yazayim düzeltmesinide admin yapsin.

Kod Seç Genişlet

.smalltext a {
    width: 50%;
    display: inline-block;
    overflow: hidden;
    white-space: nowrap;
    word-wrap: normal;
    text-overflow: ellipsis;
    vertical-align: middle;
}