smf 2.0.x link ağacı css navigation

Başlatan snrj, 14 Eyl 2015 16:14

« önceki - sonraki »

0 Üyeler ve 1 Ziyaretçi konuyu incelemekte.

*

  1. 3,261

  2. 596

  3. 1076




index.template.php de bul
// Show a linktree. This is that thing that shows "My Community | General Category | General Discussion"..
function theme_linktree($force_show = false)
{
global $context, $settings, $options, $shown_linktree;

// If linktree is empty, just return - also allow an override.
if (empty($context['linktree']) || (!empty($context['dont_default_linktree']) && !$force_show))
return;

echo '
<div class="navigate_section">
<ul>';

// Each tree item has a URL and name. Some may have extra_before and extra_after.
foreach ($context['linktree'] as $link_num => $tree)
{
echo '
<li', ($link_num == count($context['linktree']) - 1) ? ' class="last"' : '', '>';

// Show something before the link?
if (isset($tree['extra_before']))
echo $tree['extra_before'];

// Show the link, including a URL if it should have one.
echo $settings['linktree_link'] && isset($tree['url']) ? '
<a href="' . $tree['url'] . '"><span>' . $tree['name'] . '</span></a>' : '<span>' . $tree['name'] . '</span>';

// Show something after the link...?
if (isset($tree['extra_after']))
echo $tree['extra_after'];

// Don't show a separator for the last one.
if ($link_num != count($context['linktree']) - 1)
echo ' »';

echo '
</li>';
}
echo '
</ul>
</div>';

$shown_linktree = true;
}

değiştir
// Show a linktree. This is that thing that shows "My Community | General Category | General Discussion"..
function theme_linktree($force_show = false)
{
global $context, $settings, $options, $shown_linktree;

// If linktree is empty, just return - also allow an override.
if (empty($context['linktree']) || (!empty($context['dont_default_linktree']) && !$force_show))
return;

echo '
<div class="breadcrumb">';

// Each tree item has a URL and name. Some may have extra_before and extra_after.
foreach ($context['linktree'] as $link_num => $tree)
{
// Show something before the link?
if (isset($tree['extra_before']))
echo $tree['extra_before'];

// Show the link, including a URL if it should have one.
echo $settings['linktree_link'] && isset($tree['url']) ? '
<a href="' . $tree['url'] . '"><span>' . $tree['name'] . '</span></a>' : '<span>' . $tree['name'] . '</span>';

// Show something after the link...?
if (isset($tree['extra_after']))
echo $tree['extra_after'];

// Don't show a separator for the last one.
if ($link_num != count($context['linktree']) - 1)
echo '';
}
echo '
</div><script src="', $settings['theme_url'], '/scripts/prefixfree-1.0.7.js" type="text/javascript"></script>';

$shown_linktree = true;
}

index.css de en alta ekle
.breadcrumb {
/*centering*/
display: inline-block;
box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.35);
overflow: hidden;
border-radius: 5px;
/*Lets add the numbers for each link using CSS counters. flag is the name of the counter. to be defined using counter-reset in the parent element of the links*/
counter-reset: flag;
}

.breadcrumb a {
text-decoration: none;
outline: none;
display: block;
float: left;
font-size: 11px;
line-height: 25px;
color: white;
/*need more margin on the left of links to accomodate the numbers*/
padding: 0 10px 0 60px;
background: #666;
background: linear-gradient(#666, #333);
position: relative;
}
/*since the first link does not have a triangle before it we can reduce the left padding to make it look consistent with other links*/
.breadcrumb a:first-child {
padding-left: 40px;
border-radius: 5px 0 0 5px; /*to match with the parent's radius*/
}
.breadcrumb a:first-child:before {
left: 14px;
}
.breadcrumb a:last-child {
border-radius: 0 5px 5px 0; /*this was to prevent glitches on hover*/
padding-right: 20px;
}

/*hover/active styles*/
.breadcrumb a.active, .breadcrumb a:hover{
background: #333;
background: linear-gradient(#333, #000);
}
.breadcrumb a.active:after, .breadcrumb a:hover:after {
background: #333;
background: linear-gradient(135deg, #333, #000);
}

/*adding the arrows for the breadcrumbs using rotated pseudo elements*/
.breadcrumb a:after {
content: '';
position: absolute;
top: 0;
right: -11px; /*half of square's length*/
/*same dimension as the line-height of .breadcrumb a */
width: 26px;
height: 25px;
/*as you see the rotated square takes a larger height. which makes it tough to position it properly. So we are going to scale it down so that the diagonals become equal to the line-height of the link. We scale it to 70.7% because if square's:
length = 1; diagonal = (1^2 + 1^2)^0.5 = 1.414 (pythagoras theorem)
if diagonal required = 1; length = 1/1.414 = 0.707*/
transform: scale(0.707) rotate(45deg);
/*we need to prevent the arrows from getting buried under the next link*/
z-index: 1;
/*background same as links but the gradient will be rotated to compensate with the transform applied*/
background: #666;
background: linear-gradient(135deg, #666, #333);
/*stylish arrow design using box shadow*/
box-shadow:
2px -2px 0 2px rgba(0, 0, 0, 0.4),
3px -3px 0 2px rgba(255, 255, 255, 0.1);
/*
5px - for rounded arrows and
50px - to prevent hover glitches on the border created using shadows*/
border-radius: 0 5px 0 50px;
}
/*we dont need an arrow after the last link*/
.breadcrumb a:last-child:after {
content: none;
}
/*we will use the :before element to show numbers*/
.breadcrumb a:before {
content: counter(flag, decimal);
counter-increment: flag;
border-radius: 100%;
width: 15px;
height: 15px;
line-height: 15px;
margin: 5px 0px;
position: absolute;
top: 0px;
left: 30px;
background: transparent linear-gradient(#444, #222) repeat scroll 0% 0%;
font-weight: bold;
text-align: center;
}


.flat a, .flat a:after {
background: white;
color: black;
transition: all 0.5s;
}
.flat a:before {
background: white;
box-shadow: 0 0 0 1px #ccc;
}
.flat a:hover, .flat a.active,
.flat a:hover:after, .flat a.active:after{
background: #1B9BFF;
}


beyaz olsun isteyen arkadaşlar index.template.php bul

echo '
<div class="breadcrumb">';
değiştir
echo '
<div class="breadcrumb flat">';


ekteki js dosyasını temanızın script klasörüne atınız

****

  1. 503

  2. 83

  3. 109
Bu ne ise yariyor bilen varmi
hey gidi dünya..

***

  1. 142

  2. 16

  3. 34
Benim site de "Konu:" diye bir yazı çıkıyor.Bu neden ile sonda bulunan konu ismi resimde ki gibi aşağı kayıyor.


*

  1. 3,261

  2. 596

  3. 1076

modlardan biri veya display.php ,display.tempalte.php kodlarında linktree ekleme yapıyor konu içinde onu bulmak lazım

***

  1. 142

  2. 16

  3. 34
Display.php den geliyor.Ayrıca Mesaj yazarken Önizleme yapıldığında da link ağacı bozuluyor.

    // Build the link tree.
   $context['linktree'][] = array(
      'url' => $scripturl . '?topic=' . $topic . '.0',
      'name' => $topicinfo['subject'],
      'extra_before' => $settings['linktree_inline'] ? $txt['topic'] . ': ' : ''
   );

*

  1. 3,261

  2. 596

  3. 1076
tam emin değilim ama kimyacı şu şekilde bir değiştirin
// Build the link tree.
$context['linktree'][] = array(
'url' => $scripturl . '?topic=' . $topic . '.0',
'name' => $topicinfo['subject'],
'extra_before' => $settings['linktree_inline'] ? ' : ' : ''
);

***

  1. 142

  2. 16

  3. 34
Ben de birçok deneme yaptım.Sizin verdiğiniz kodları da denedim.Konu içerisinde resimde de görüldüğü gibi iki nokta kalıyor.



Ayrıca önizlemede konu ismi tekrardan yazıldığı için bir kayma söz konusudur.


*

  1. 5

  2. 2

iki noktayı silmek için alttaki şekilde yapın
'extra_before' => $settings['linktree_inline'] ? ' ' : ''
diğeri için post templateyi düzenlemek gerekecek sanırım

***

  1. 142

  2. 16

  3. 34
Alıntı yapılan: demo - 15 Eyl 2015 23:51iki noktayı silmek için alttaki şekilde yapın
'extra_before' => $settings['linktree_inline'] ? ' ' : ''
diğeri için post templateyi düzenlemek gerekecek sanırım

Evet bu şekilde nokta gitti.Fakat Önizleme sorunu aynı şekilde çıkıyor.Teşekkürler.

***

  1. 142

  2. 16

  3. 34
İndex_template.php deki kodu aşağıda ki gibi değiştirdim.Şimdi normal görünüyor.

// Show a linktree. This is that thing that shows "My Community | General Category | General Discussion"..
function theme_linktree($force_show = false)
{
global $context, $settings, $options, $shown_linktree;

// If linktree is empty, just return - also allow an override.
if (empty($context['linktree']) || (!empty($context['dont_default_linktree']) && !$force_show))
return;

echo '
<div class="breadcrumb flat">';

// Each tree item has a URL and name. Some may have extra_before and extra_after.
foreach ($context['linktree'] as $link_num => $tree)
{

// Show the link, including a URL if it should have one.
echo $settings['linktree_link'] && isset($tree['url']) ? '
<a href="' . $tree['url'] . '"><span>' . $tree['name'] . '</span></a>' : '<span>' . $tree['name'] . '</span>';

// Show something after the link...?
if (isset($tree['extra_after']))
echo $tree['extra_after'];

// Don't show a separator for the last one.
if ($link_num != count($context['linktree']) - 1)
echo '';

}
echo '
</div>
<script type="text/javascript" src="', $settings['default_theme_url'], '/scripts/prefixfree-1.0.7.js"></script>';

$shown_linktree = true;
}

*

  1. 277

  2. 41

  3. 17
04 Ksm 2015 14:25 #10 Son düzenlenme: 04 Ksm 2015 14:48 rock3r
Üstad burada ki index.template.php içerikleri teknoromi plus da yok fakat default tema da var . Default da değiştirdim olmadı . Acaba ben mi hata yaptım . Dosya ekinde temya ait  index.template.php paylaşıyorum .

// Show a linktree. This is that thing that shows "My Community | General Category | General Discussion"..
function theme_linktree($force_show = false)
{
global $context, $settings, $options, $shown_linktree;

// If linktree is empty, just return - also allow an override.
if (empty($context['linktree']) || (!empty($context['dont_default_linktree']) && !$force_show))
return;

echo '
<div class="navigate_section">
<ul>';

// Each tree item has a URL and name. Some may have extra_before and extra_after.
foreach ($context['linktree'] as $link_num => $tree)
{
echo '
<li', ($link_num == count($context['linktree']) - 1) ? ' class="last"' : '', '>';

// Show something before the link?
if (isset($tree['extra_before']))
echo $tree['extra_before'];

// Show the link, including a URL if it should have one.
echo $settings['linktree_link'] && isset($tree['url']) ? '
<a href="' . $tree['url'] . '"><span>' . $tree['name'] . '</span></a>' : '<span>' . $tree['name'] . '</span>';

// Show something after the link...?
if (isset($tree['extra_after']))
echo $tree['extra_after'];

// Don't show a separator for the last one.
if ($link_num != count($context['linktree']) - 1)
echo ' »';

echo '
</li>';
}
echo '
</ul>
</div>';

$shown_linktree = true;
}

***

  1. 142

  2. 16

  3. 34

*

  1. 277

  2. 41

  3. 17
Evet ekledim ama olmadı .  Görüntü yanda ki gibiydi hala aynı .

***

  1. 142

  2. 16

  3. 34
Ekte ki dosyayı bir deneyiniz lütfen.

Ayrıca themanızın "scripts" klasörüne "prefixfree-1.0.7.js" dosyasını atmayı unutmayınız.

*

  1. 277

  2. 41

  3. 17
Alıntı yapılan: kimyaci - 05 Ksm 2015 18:46Ekte ki dosyayı bir deneyiniz lütfen.

Ayrıca themanızın "scripts" klasörüne "prefixfree-1.0.7.js" dosyasını atmayı unutmayınız.


Üstad denedim olmadı . yanda ki gibi göründü


Benzer Konular (5)


MENU ×