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

Başlatan tekyürek, 31 Oca 2017, 03:39

« önceki - sonraki »

0 Üye ve 1 Ziyaretçi konuyu incelemekte.

tarantula901

Normal modun ayarlarını 2 sıralı ayarlayarak kontrol edin mobilden hangi modu kullanıyordunuz.
Sitenizde işlem yapmadan önce mutlaka yedek alın.

Pm'den ve Skypeden istenilen destekler ücretlidir. Ücret ödememek için lütfen sitede sorunuzu konu açarak sorabilirsiniz.

Ücretli Smf Destek İçin

buyuknet

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

#17
23 Eyl 2018, 20:36 Son düzenlenme: 23 Eyl 2018, 20:41 tekyürek
mobilde gizlemek  için


responsive.css de

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



altına ekle

Kod [Seç]
.smalltext, tr.smalltext th {
display: none;
}
  




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

fabak

#18
29 Eyl 2018, 18:17 Son düzenlenme: 29 Eyl 2018, 18:19 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ç]
<div>test ne kadar uzun bir yazı..</div>

Bunu kısaltmak istediğimizde yapmamiz gereken

Kod [Seç]
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

#20
29 Eyl 2018, 18:49 Son düzenlenme: 29 Eyl 2018, 18:51 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ç]

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ç]
.smalltext a {
    width: 50%;
    display: inline-block;
    overflow: hidden;
    white-space: nowrap;
    word-wrap: normal;
    text-overflow: ellipsis;
    vertical-align: middle;
}