SMF 2.1Açılır Kapanır Alt Bölümler (bottom_section_folding_opens_and_closes)

Merhaba, tekrar hoş geldiniz!

Bilgi sahibi olanlarla ihtiyaç duyanları buluşturmak, farklı bakış açılarına sahip insanları bir araya getirerek birbirlerini daha iyi anlamalarını sağlamak ve herkesin bilgisini paylaşmasını sağlamak istiyoruz.

replikacep

Tam Üye
Katılım
15 Ara 2018
Mesajlar
233
Tepkime puanı
29
Puanları
28
Yaş
1020
Web sitesi
www.replikacep.com
SMF 2.1 İÇİN AÇILIR KAPANIR  alt bölümler  resimdeki gözüktügü gibidir  mod tarafımdan yapılmıştır  güle güle kullanın

Smf  2.1 için  geliştirdigim  bir moddur

made by www.replikacep.com

Version: 2.1 Date 2019

Compatibility: SMF 2.1 RC1

*Add new look for smf 2.1 RC 1

2.1  için  yaptım modu

mod tarafımdan yapılmıştır  :)

MOD : default Temaya  göre tasarlanmıştır  renkler ve  iconları dileyen istedigi temaya göre degiştirebilir  çok az php  bilmeniz yeterli  renkleri ve  butonu saga yada sola  kaydırmak için

https://yadi.sk/d/v1ik4sn2Ame2KQ

örnek :  index.css de modu yükledikten sonra bul 

Kod:
.dropbtn {
    background-color: #557ea0;
    color: white;
    padding: auto;
    font-size: 14px;
    border: none;
    cursor: pointer;
    border: 1.5px solid #d1994c;
    margin-left: auto;
    margin-right: auto;
    margin-top: auto;
}

aşadakilerle  oynayın

Kod:
  margin-left: auto;
    margin-right: auto;
    margin-top: auto;
 


örnek :margin-left: auto;  yerine  margin-left: 60px; yaparsak  buton  saga  dogru kayar

yukarı  kaydırmak için : margin-top: auto; yerine  margin-top: -10px; yapın




Görseller


qdBkZV.png


MVJG37.png





mobilde  gizlemek istiyorsanız  icon ları


responsive.css de  bul

Kod:
@media (max-width: 480px) {

altına ekle

Kod:
.fa-comments-o:before{display: none; }
.dropdown-content a {
 
  color: #557ea0;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  font-family: "Tahoma", sans-serif;
  font-weight: bold;
  line-height: 1.5em;
  margin-left: 2px;
  margin-right: auto;
  margin-top: auto;

}

bu yukarıa verdigim bir örnek tir


buton  büyük diyorsanız

index.css de  bul

Kod:
.dropbtn {
    background-color: #557ea0;
    color: white;
    padding: auto;
    font-size: 16px;
    border: none;
    cursor: pointer;
    border: 1.5px solid #d1994c;
    margin-left: auto;
    margin-right: auto;
    margin-top: auto;
}



font-size: 16px;  bunu  13 yapın buton küçülür
 
Eline sağlık güzel paylaşım.
 
rica ederim  2.1 çıkmadan  baya bişey  entegre etmeliyim  :)

alt bölümlere icon koymaya ugraşıyorum  yapamadım  :)

Kod:
global $txt, $scripturl, $context, $settings;

 // Show the "Child Boards: ". (there's a link_children but we're going to bold the new ones...)
 if (!empty($board['children']))
 {
 // Sort the links into an array with new boards bold so it can be imploded.
 $children = array();
 /* Each child in each board's children has:
 id, name, description, new (is it new?), topics (#), posts (#), href, link, and last_post. */
 foreach ($board['children'] as $child)
 {
 if (!$child['is_redirect'])
 $child['link'] = '' . ($child['new'] ? '<a href="' . $scripturl . '?action=unread;board=' . $child['id'] . '" title="' . $txt['new_posts'] . ' (' . $txt['board_topics'] . ': ' . comma_format($child['topics']) . ', ' . $txt['posts'] . ': ' . comma_format($child['posts']) . ')" class="new_posts">' . $txt['new'] . '</a>' : '') . '<a href="' . $child['href'] . '" ' . ($child['new'] ? 'class="board_new_posts" ' : '') . 'title="' . ($child['new'] ? $txt['new_posts'] : $txt['old_posts']) . ' (' . $txt['board_topics'] . ': ' . comma_format($child['topics']) . ', ' . $txt['posts'] . ': ' . comma_format($child['posts']) . ')">' . $child['name'] . '</a>';
 else
 $child['link'] = '<a href="' . $child['href'] . '" title="' . comma_format($child['posts']) . ' ' . $txt['redirects'] . ' - ' . $child['short_description'] . '">' . $child['name'] . '</a>';

 // Has it posts awaiting approval?
 if ($child['can_approve_posts'] && ($child['unapproved_posts'] || $child['unapproved_topics']))
 $child['link'] .= ' <a href="' . $scripturl . '?action=moderate;area=postmod;sa=' . ($child['unapproved_topics'] > 0 ? 'topics' : 'posts') . ';brd=' . $child['id'] . ';' . $context['session_var'] . '=' . $context['session_id'] . '" title="' . sprintf($txt['unapproved_posts'], $child['unapproved_topics'], $child['unapproved_posts']) . '" class="moderation_link">(!)</a>';

 $children[] = $child['new'] ? '<span class="strong">' . $child['link'] . '</span>' : '<span>' . $child['link'] . '</span>';
 }

 echo '
 

<script src="', $settings['default_theme_url'], '/scripts/al_dropdown.js"></script>
 <a div id="board_', $board['id'], '_children" class="dropdown">
 <li><i class="fa fa-comments-o"><button onclick="myFunction()" class="dropbtn"><link href="', $settings['default_theme_url'], '/css/all.min.css" rel="stylesheet">', $txt['sub_boards'], ' </i></button></a> 
 <div id="myDropdown" class="dropdown-content"> ', implode($children), ' 
 </div>
 </div>';
 
 
 }


bunu nereye koymalıyım her alt bölümün başında gözükmesi için
Kod:
<li><i class="fa fa-comments-o">


EDİT :
Kod:
$children[] = $child['new'] ? '<li><span class="strong"><i class="fa fa-comments-o" style="color:orange"></i> ' . $child['link'] . '</span>' : '<span><i class="fa fa-comments-o" style="color:#777"></i> ' . $child['link'] . '</span>';

NOT : GÖZÜLDÜ
 
merhaba burdaki li tağinin bir karsiligi yoksa silin muhtemelen hata verecek.

Kod:
$children[] = $child['new'] ? '<li><span class="strong"><i class="fa fa-comments-o" style="color:orange"></i> ' . $child['link'] . '</span>' : '<span><i class="fa fa-comments-o" style="color:#777"></i> ' . $child['link'] . '</span>';
 
buranın  içinden çıkamadım  yeni fark ettim    alt bölümler butonuna tıklayın ya  kendi  bölümünde  çekmiyor  muş

orjinali

Kod:
		echo '
					<div id="board_', $board['id'], '_children" class="children">
						<p><strong id="child_list_', $board['id'], '">', $txt['sub_boards'], '</strong>', implode($children), '</p>
					</div>';

burasıda  edit

Kod:
			<a div id="board_', $board['id'], '_children" class="dropdown">
					<button onclick="myFunction()" class="dropbtn" id="child_list_', $board['id'], '">', $txt['sub_boards'], '</button></a> 
					<div id="myDropdown" class="dropdown-content"> ', implode($children), '   
                         
					  </div>';

sanırım yanlış lık yapmışsım
 

Ekli dosyalar

  • Screenshot_20190106-162646_Samsung Internet.jpg
    Screenshot_20190106-162646_Samsung Internet.jpg
    287.8 KB · Görüntüleme: 1
ikonlar güncel değil sitesine gidip güncel surumle değişin
 
buranın  içinden çıkamadım  yeni fark ettim    alt bölümler butonuna tıklayın abi  2 ci bir alt bölüm acınca fark ettim  butona tıklayınca  id 1  bu bölümü açıyor  tıkladıgın bölümdeki alt bölümleri açmıyor

yani kısacası  2 ci sıradaki alt  bölüm butonuna tıklayınca ilk kategorinin alt bölümü açılıyor  :)
http://demo.replikacepsatis.com/index.php

orjinali

Kod:
echo '
 <div id="board_', $board['id'], '_children" class="children">
 <p><strong id="child_list_', $board['id'], '">', $txt['sub_boards'], '</strong>', implode($children), '</p>
 </div>';

burasıda  edit

Kod:
<a div id="board_', $board['id'], '_children" class="dropdown">
 <ul><button onclick="myFunction()" class="dropbtn">', $txt['sub_boards'], ' </button></a> 
 <div id="myDropdown" class="dropdown-content"> ', implode($children), '  
 </div>
  </div>';

sanırım yanlış lık yapmışsım


http://demo.replikacepsatis.com/index.php  abi bi baksan çözemiyorum :)  ftp şifreleri aynı

bu butonu aldıgım yer  : https://www.w3schools.com/howto/howto_js_dropdown.asp
 
ftp ye erişme şansim şuan yok

BoardIndex.template.php kodlarini
Bununla degisin

Kod:
// Has it posts awaiting approval?
			if ($child['can_approve_posts'] && ($child['unapproved_posts'] || $child['unapproved_topics']))
				$child['link'] .= ' <a href="' . $scripturl . '?action=moderate;area=postmod;sa=' . ($child['unapproved_topics'] > 0 ? 'topics' : 'posts') . ';brd=' . $child['id'] . ';' . $context['session_var'] . '=' . $context['session_id'] . '" title="' . sprintf($txt['unapproved_posts'], $child['unapproved_topics'], $child['unapproved_posts']) . '" class="moderation_link">(!)</a>';

			$children[] = $child['new'] ? '' . $child['link'] . '' : '' . $child['link'] . '';
		}

		echo '
					<div id="board_', $board['id'], '_children" class="children dropdown">
						<button onclick="myFunction()" class="dropbtn child_list_', $board['id'], '">', $txt['sub_boards'], '</button><div id="myDropdown" class="dropdown-content">', implode($children), '</div>
					</div>';
	}
}

index.css ye ekleyin

Kod:
/* Dropdown Button */
.dropbtn {
  background-color: #3498DB;
  color: white;
  font-size: 12px;
  border: none;
  cursor: pointer;
  padding: 0.4em;
  height: 2em;
  line-height: 0em;
}

/* Dropdown button on hover & focus */
.dropbtn:hover, .dropbtn:focus {
  background-color: #2980B9;
}

/* The container <div> - needed to position the dropdown content */
.dropdown {
  display: inline-block;
}

/* Dropdown Content (Hidden by Default) */
.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f1f1f1;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

/* Links inside the dropdown */
.dropdown-content a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
}

/* Change color of dropdown links on hover */
.dropdown-content a:hover {background-color: #ddd}

/* Show the dropdown menu (use JS to add this class to the .dropdown-content container when the user clicks on the dropdown button) */
.show {display:block;}

temanizin theme.js yi acin

üste bunu ekleyin

Kod:
/* When the user clicks on the button, 
toggle between hiding and showing the dropdown content */
function myFunction() {
  document.getElementById("myDropdown").classList.toggle("show");
}

// Close the dropdown menu if the user clicks outside of it
window.onclick = function(event) {
  if (!event.target.matches('.dropbtn')) {
    var dropdowns = document.getElementsByClassName("dropdown-content");
    var i;
    for (i = 0; i < dropdowns.length; i++) {
      var openDropdown = dropdowns[i];
      if (openDropdown.classList.contains('show')) {
        openDropdown.classList.remove('show');
      }
    }
  }
}
 
aynen ekledim dediginiz gibi degişen bişey olmadı  en üstteki alt bölüm açılıyor aşadaki  alt bölüme tıklayınca    anlam veremiyorum  ne güzel mod  bitti demiştim

abi sen musait oluna  bi bak sana zahmet ftp den


EDİT  : Sorun çözülmüştür


Kod:
function template_bi_board_children($board)
{
	global $txt, $scripturl, $context, $settings;

	// Show the "Child Boards: ". (there's a link_children but we're going to bold the new ones...)
	if (!empty($board['children']))
	{
		// Sort the links into an array with new boards bold so it can be imploded.
		$children = array();
		/* Each child in each board's children has:
			id, name, description, new (is it new?), topics (#), posts (#), href, link, and last_post. */
		foreach ($board['children'] as $child)
		{
			if (!$child['is_redirect'])
				$child['link'] = '' . ($child['new'] ? '<a href="' . $scripturl . '?action=unread;board=' . $child['id'] . '" title="' . $txt['new_posts'] . ' (' . $txt['board_topics'] . ': ' . comma_format($child['topics']) . ', ' . $txt['posts'] . ': ' . comma_format($child['posts']) . ')" class="new_posts">' . $txt['new'] . '</a>' : '') . '<a href="' . $child['href'] . '" ' . ($child['new'] ? 'class="board_new_posts" ' : '') . 'title="' . ($child['new'] ? $txt['new_posts'] : $txt['old_posts']) . ' (' . $txt['board_topics'] . ': ' . comma_format($child['topics']) . ', ' . $txt['posts'] . ': ' . comma_format($child['posts']) . ')">' . $child['name'] . '</i></a>';
			else
				$child['link'] = '<a href="' . $child['href'] . '" title="' . comma_format($child['posts']) . ' ' . $txt['redirects'] . ' - ' . $child['short_description'] . '">' . $child['name'] . '</a>';

			// Has it posts awaiting approval?
			if ($child['can_approve_posts'] && ($child['unapproved_posts'] || $child['unapproved_topics']))
				$child['link'] .= ' <a href="' . $scripturl . '?action=moderate;area=postmod;sa=' . ($child['unapproved_topics'] > 0 ? 'topics' : 'posts') . ';brd=' . $child['id'] . ';' . $context['session_var'] . '=' . $context['session_id'] . '" title="' . sprintf($txt['unapproved_posts'], $child['unapproved_topics'], $child['unapproved_posts']) . '" class="moderation_link">(!)</a>';

            $children[] = $child['new'] ? '<li><span class="strong"><i class="fa fa-comments-o" style="color:orange"> ' . $child['link'] . '</span>' : '<span><i class="fa fa-comments-o" style="color:#34373b;margin-left: 2px;margin-right: auto;margin-top: 10px;"></i> ' . $child['link'] . '</span>';   
		  
		  }
           echo'<script> function myFunction_', $board['id'], '() {	document.getElementById("myDropdown_', $board['id'], '").classList.toggle("show"); }	  
                   window.onclick = function(event) {  if (!event.target.matches(\'.dropbtn\')) { var dropdowns = document.getElementsByClassName("dropdown-content");
               var i; for (i = 0; i < dropdowns.length; i++) { var openDropdown = dropdowns[i];
               if (openDropdown.classList.contains(\'show\')) { openDropdown.classList.remove(\'show\'); } } } } </script>
                  <link href="', $settings['default_theme_url'], '/css/all.css" rel="stylesheet">
                  <a div id="board_', $board['id'], '_children" class="dropdown">
					<ul><button onclick="myFunction_', $board['id'], '()" class="dropbtn">', $txt['sub_boards'], ' </button></a> 
					 <div id="myDropdown_', $board['id'], '" class="dropdown-content"> ', implode($children), '  
					  </div>';												 
	}
}


bu şekil  yaparak çözüldü
 

Geri
Üst Alt