Jump to content
  • 1

Tutorial aranjare subforumuri pe 3 coloane

Portocala

Asked by +Portocala,

 Share

Question

Portocala Proficient

+Portocala

Posted
Posted

La baza e acelasi lucru ca si in ipb 3.4 dar in ipb 4.0 s-au schimbat putn if-urile.

Tutorialul:

Mergeti la : ACP > Customization > Themes > Ur theme > HTML & CSS Codes > forums > front > index > forumRow si cautati :

{{if $forum->hasChildren()}}
				<ul class="ipsDataItem_subList ipsList_inline">
					{{foreach $forum->children() as $subforum}}
						<li class="{{if \IPS\forums\Topic::containerUnread( $subforum )}}ipsDataItem_unread{{endif}}">
							<a href="{$subforum->url()}">{{if \IPS\forums\Topic::containerUnread( $subforum )}}<span class='ipsItemStatus ipsItemStatus_tiny {{if !\IPS\forums\Topic::containerUnread( $subforum ) && !$subforum->redirect_on}}ipsItemStatus_read{{endif}}'><i class="fa fa-circle"></i></span>&nbsp;{{endif}}{$subforum->_title}</a>
						</li>
					{{endforeach}}
				</ul>
			{{endif}}

Stergeti asta, si cautati:

{{if $forum->description}}
				<div class="ipsDataItem_meta ipsType_richText">{$forum->description|raw}</div>
			{{endif}}

Dedesupt agauti:

{{if $forum->hasChildren()}}
					<ol class='ipsList_inline ipsType_small subforums2'>
{{foreach $forum->children() as $subforum}}</ol>
<ol class='ipsList_inline ipsType_small subforums3'>
{{if \IPS\forums\Topic::containerUnread( $subforum )}}
<li class='unread'>
{{endif}}
{{if !\IPS\forums\Topic::containerUnread( $subforum )}}
<li>
{{endif}}
{{endforeach}}
</ol>
<ol class='ipsList_inline ipsType_small subforums'>
{{foreach $forum->children() as $subforum}}</ol>
<ol class='ipsList_inline ipsType_small subforums1'>
{{if \IPS\forums\Topic::containerUnread( $subforum )}}<li class='unread'>
{{endif}}
{{if !\IPS\forums\Topic::containerUnread( $subforum )}}
<li>
{{endif}}
<a href="{$subforum->url()}">{$subforum->_title}</a></li>
{{endforeach}}</ol>
			{{endif}}

Aceasta este tot! Munca este gata, aici doar. (In acelasi timp plasati subforumurile sub descrierea forumului "mama")

Acum mergeti la CSS Tab > custom.css si adaugati la sfarsit:

ol.subforums1 {
  
  margin-top: 3px;
  float: left;
  width: 33%;
  
}
ol.subforums1 li {
  
  background: url('http://mixgamers.ro/forum/public/style_images/wipeout/subforum_vechi.png') no-repeat 0 50%;
  padding: 0 15px 0 15px;
  margin: 0;
  float: left;
  
}
.subforums1 li.unread { 
  font-weight: bold; 
  background-image: url('http://mixgamers.ro/forum/public/style_images/wipeout/subforum_nou.png'); 
}
ol.subforums2 {
  
  width: 33%;
  overflow: hidden;
  
}
ol.subforums2 li {
  
  background: url('http://mixgamers.ro/forum/public/style_images/wipeout/subforum_vechi.png') no-repeat 0 50%;
  padding: 0 15px 0 15px;
  margin: 0;
  float: left;
  
}
.subforums2 li.unread { 
  font-weight: bold; 
  background-image: url('http://mixgamers.ro/forum/public/style_images/wipeout/subforum_nou.png'); 
}
ol.subforums3 {
  width: 33%;
  overflow: hidden;
}
ol.subforums3 li {
  background: url('http://mixgamers.ro/forum/public/style_images/wipeout/subforum_vechi.png') no-repeat 0 50%;
  padding: 0 15px 0 15px;
  margin: 0;
  float: left;
}
.subforums3 li.unread { 
  font-weight: bold;
  background-image: url('http://mixgamers.ro/forum/public/style_images/wipeout/subforum_nou.png'); 
}

Ca sa schimbati imaginile la forumurile citite editati link-ul aceasta oriunde il gasiti in codul CSS de mai sus:

http://mixgamers.ro/forum/public/style_images/wipeout/subforum_vechi.png

Si ca sa schimbati imaginile la forumurile necitite editati link-ul aceasta oriunde il gasiti in codul CSS de mai sus:

http://mixgamers.ro/forum/public/style_images/wipeout/subforum_nou.png

Asta este tot! Munca este gata si aici!

Succes! :)

 

  • Like 2
  • Upvote 3
  • Downvote 2

https://www.facebook.com/puffysticks/

https://www.instagram.com/puffystickscom/

https://twitter.com/puffysticks

Link to comment
Share on other sites

16 answers to this question

Recommended Posts

  • 1
  • Moderators
Courage Grand Master

Courage

Posted
  • Moderators
Posted

Si .... care e greseala? Stiti ce face acel if macar?

Pentru  

<li{{if \IPS\forums\Topic::containerUnread( $subforum )}} class="unread"{{endif}}>

daca  

\IPS\forums\Topic::containerUnread( $subforum )

are valoarea true, atunci devine  

<li class="unread">

in caz contrar e  

<li>

 

On 8/28/2018 at 11:17 PM, dOc MFX said:

O mica corectie ai uitat sa inchizi un > la  ( e inchis gresit ) 


<li>{{if \IPS\forums\Topic::containerUnread( $subforum )}} class="unread"{{endif}}>

Asta n-are niciun sens. Vrei sa afisezi {{if \IPS\forums\Topic::containerUnread( $subforum )}} class="unread"{{endif}}> in pagina? Pe langa ca dai peste cap tot codul.

Link to comment
Share on other sites

  • 0
Portocala Proficient

+Portocala

Posted
  • Author
Posted
2 hours ago, AssAssiN said:

Mi-am stricat toata tema cu tn ....

Oh scuze... :( Pentru tine actulizez tutorialul ca-mi pare rau  :TrollTriste:

Testat pe ipb 4.3.5
 

Spoiler

 

Mergeti la : ACP > Customization > Themes > Ur theme > HTML & CSS Codes > forums > front > index > forumRow si cautati: 


			{{if $forum->hasChildren()}}
				<ul class="ipsDataItem_subList ipsList_inline">
					{{foreach $forum->children() as $subforum}}
						<li class="{{if \IPS\forums\Topic::containerUnread( $subforum )}}ipsDataItem_unread{{endif}}">
							<a href="{$subforum->url()}">{{if \IPS\forums\Topic::containerUnread( $subforum )}}<span class='ipsItemStatus ipsItemStatus_tiny {{if !\IPS\forums\Topic::containerUnread( $subforum ) && !$subforum->redirect_on}}ipsItemStatus_read{{endif}}'><i class="fa fa-circle"></i></span>&nbsp;{{endif}}{$subforum->_title}</a>
						</li>
					{{endforeach}}
				</ul>
			{{endif}}
			{{if $forum->description}}
				<div class="ipsDataItem_meta ipsType_richText ipsContained">{$forum->description|raw}</div>
			{{endif}}

Si schimbati in:  


			{{if $forum->description}}
				<div class="ipsDataItem_meta ipsType_richText ipsContained">{$forum->description|raw}</div>
			{{endif}}
			{{if $forum->hasChildren()}}
				<ul class="puffysticks-subforums">
					{{foreach $forum->children() as $subforum}}
						<li{{if \IPS\forums\Topic::containerUnread( $subforum )}} class="unread"{{endif}}>
							<a href="{$subforum->url()}">{{if \IPS\forums\Topic::containerUnread( $subforum )}}<span class='ipsItemStatus ipsItemStatus_tiny {{if !\IPS\forums\Topic::containerUnread( $subforum ) && !$subforum->redirect_on}}ipsItemStatus_read{{endif}}'><i class="fa fa-circle"></i></span> {{endif}}{$subforum->_title}</a>
						</li>
					{{endforeach}}
				</ul>
			{{endif}}

Mai adaugati si asta in ACP > Customization > Themes > Ur theme > HTML & CSS Codes > CSS Tab > front > custom > custom.css ( la sfarsit de fisier ) 


 .puffysticks_subforums {
     display: grid;
     grid-template-columns: 33% 33% 33%;
     list-style: none;
     padding: 0;
 }

 .puffysticks_subforums li:before {
     content: '\f067';
     font-family: 'FontAwesome'; 
     font-size: 10px;
     position: relative;
     bottom: 1px;
     color: #a5a5a5;
 }

 .puffysticks_subforums li.unread:before {
     color: inherit;
 }

 @media screen and (max-width: 1280px) { 
    .puffysticks_subforums {
        grid-template-columns: 50% 50%;
    }
 }

 @media screen and (max-width: 476px) { 
    .puffysticks_subforums {
        grid-template-columns: 100%;
    }
 }

 

Enjoy :) 

  • Like 1
  • Haha 2

https://www.facebook.com/puffysticks/

https://www.instagram.com/puffystickscom/

https://twitter.com/puffysticks

Link to comment
Share on other sites
  • 0
dOc MFX Experienced

+dOc MFX

Posted
Posted
On 8/24/2018 at 2:51 PM, Portocala said:

Oh scuze... :( Pentru tine actulizez tutorialul ca-mi pare rau  :TrollTriste:

Testat pe ipb 4.3.5
 

  Hide contents

 

Mergeti la : ACP > Customization > Themes > Ur theme > HTML & CSS Codes > forums > front > index > forumRow si cautati: 



			{{if $forum->hasChildren()}}
				<ul class="ipsDataItem_subList ipsList_inline">
					{{foreach $forum->children() as $subforum}}
						<li class="{{if \IPS\forums\Topic::containerUnread( $subforum )}}ipsDataItem_unread{{endif}}">
							<a href="{$subforum->url()}">{{if \IPS\forums\Topic::containerUnread( $subforum )}}<span class='ipsItemStatus ipsItemStatus_tiny {{if !\IPS\forums\Topic::containerUnread( $subforum ) && !$subforum->redirect_on}}ipsItemStatus_read{{endif}}'><i class="fa fa-circle"></i></span>&nbsp;{{endif}}{$subforum->_title}</a>
						</li>
					{{endforeach}}
				</ul>
			{{endif}}
			{{if $forum->description}}
				<div class="ipsDataItem_meta ipsType_richText ipsContained">{$forum->description|raw}</div>
			{{endif}}

Si schimbati in:  



			{{if $forum->description}}
				<div class="ipsDataItem_meta ipsType_richText ipsContained">{$forum->description|raw}</div>
			{{endif}}
			{{if $forum->hasChildren()}}
				<ul class="puffysticks-subforums">
					{{foreach $forum->children() as $subforum}}
						<li{{if \IPS\forums\Topic::containerUnread( $subforum )}} class="unread"{{endif}}>
							<a href="{$subforum->url()}">{{if \IPS\forums\Topic::containerUnread( $subforum )}}<span class='ipsItemStatus ipsItemStatus_tiny {{if !\IPS\forums\Topic::containerUnread( $subforum ) && !$subforum->redirect_on}}ipsItemStatus_read{{endif}}'><i class="fa fa-circle"></i></span> {{endif}}{$subforum->_title}</a>
						</li>
					{{endforeach}}
				</ul>
			{{endif}}

Mai adaugati si asta in ACP > Customization > Themes > Ur theme > HTML & CSS Codes > CSS Tab > front > custom > custom.css ( la sfarsit de fisier ) 



 .puffysticks_subforums {
     display: grid;
     grid-template-columns: 33% 33% 33%;
     list-style: none;
     padding: 0;
 }

 .puffysticks_subforums li:before {
     content: '\f067';
     font-family: 'FontAwesome'; 
     font-size: 10px;
     position: relative;
     bottom: 1px;
     color: #a5a5a5;
 }

 .puffysticks_subforums li.unread:before {
     color: inherit;
 }

 @media screen and (max-width: 1280px) { 
    .puffysticks_subforums {
        grid-template-columns: 50% 50%;
    }
 }

 @media screen and (max-width: 476px) { 
    .puffysticks_subforums {
        grid-template-columns: 100%;
    }
 }

 

Enjoy :) 

O mica corectie ai uitat sa inchizi un > la  ( e inchis gresit ) 

<li>{{if \IPS\forums\Topic::containerUnread( $subforum )}} class="unread"{{endif}}>
  • Confused 1

WWW.TECTONICPX.COM [ Professional Web Design Services ]

Link to comment
Share on other sites
  • 0
dOc MFX Experienced

+dOc MFX

Posted
Posted
6 minutes ago, Portocala said:

Nu vad de unde ai scos portiunea aia de cod... Am dat cu ctrl + f and nothing.  

{{if $forum->description}}
				<div class="ipsDataItem_meta ipsType_richText ipsContained">{$forum->description|raw}</div>
			{{endif}}
			{{if $forum->hasChildren()}}
				<ul class="puffysticks-subforums">
					{{foreach $forum->children() as $subforum}}
						<li{{if \IPS\forums\Topic::containerUnread( $subforum )}} class="unread"{{endif}}>
							<a href="{$subforum->url()}">{{if \IPS\forums\Topic::containerUnread( $subforum )}}<span class='ipsItemStatus ipsItemStatus_tiny {{if !\IPS\forums\Topic::containerUnread( $subforum ) && !$subforum->redirect_on}}ipsItemStatus_read{{endif}}'><i class="fa fa-circle"></i></span> {{endif}}{$subforum->_title}</a>
						</li>
					{{endforeach}}
				</ul>
			{{endif}}

Adaugasem eu un > mai sus, de asta nu o gaseai.

WWW.TECTONICPX.COM [ Professional Web Design Services ]

Link to comment
Share on other sites
  • 0
dOc MFX Experienced

+dOc MFX

Posted
Posted
2 hours ago, Portocala said:

Deci serios, nu vad greseala, ia te rog portiunea de cod si pune varianta incorecta vs cea incorecta, evetual foloseste si culori, ca efectiv is orb aparent =))

Ti-a trimis strong, unde ai gresit. E tutorialul tau, nu ma bag peste tine!

WWW.TECTONICPX.COM [ Professional Web Design Services ]

Link to comment
Share on other sites
  • 0
dOc MFX Experienced

+dOc MFX

Posted
Posted
12 minutes ago, Courage said:

Si .... care e greseala? Stiti ce face acel if macar?

Pentru  


<li{{if \IPS\forums\Topic::containerUnread( $subforum )}} class="unread"{{endif}}>

daca  


\IPS\forums\Topic::containerUnread( $subforum )

are valoarea true, atunci devine  


<li class="unread">

in caz contrar e  


<li>

 

Asta n-are niciun sens. Vrei sa afisezi {{if \IPS\forums\Topic::containerUnread( $subforum )}} class="unread"{{endif}}> in pagina? Pe langa ca dai peste cap tot codul.

Poti sa imi faci si mie un screen cum iti arata tie forumul cu codul de mai sus? ( Multumesc anticipat )

 

 

WWW.TECTONICPX.COM [ Professional Web Design Services ]

Link to comment
Share on other sites
  • 0
strong Experienced

+strong

Posted
Posted
16 hours ago, Courage said:

Si .... care e greseala? Stiti ce face acel if macar?

Cel original are {{if etc.. adaugat in class 

<li class="{{if \IPS\forums\Topic::containerUnread( $subforum )}}ipsDataItem_unread{{endif}}">

Cel dat de Portocala il are in jurul lui. 

<li{{if \IPS\forums\Topic::containerUnread( $subforum )}} class="unread"{{endif}}>

Nu are rost sa mai lungim discutia aiurea.

 

— steam

Link to comment
Share on other sites
  • 0
  • Moderators
Courage Grand Master

Courage

Posted
  • Moderators
Posted
3 minutes ago, strongtaz said:

Este gresit ca nu ne-am uitat mai atent la acel {{if...

Cel original are {{if etc.. adaugat in class 


<li class="{{if \IPS\forums\Topic::containerUnread( $subforum )}}ipsDataItem_unread{{endif}}">

Cel dat de Portocala il are in jurul lui. 


<li{{if \IPS\forums\Topic::containerUnread( $subforum )}} class="unread"{{endif}}>

Nu are rost sa mai lungim discutia aiurea.

Yes my friend, daca subforumul nu e citit, clasa css care se aplica este "unread" (definita in primul post din acest topic) in loc de "ipsDataItem_unread". So ... unde e greseala?

7 minutes ago, dOc MFX said:

Poti sa imi faci si mie un screen cum iti arata tie forumul cu codul de mai sus? ( Multumesc anticipat )

N-am stat sa rulez, nici n-am timp momentan, sunt la lucru. Dar daca vrei tu neaparat vad mai tarziu. Acel tag <li se inchide la {{endif}}>. Deci n-a uitat sa inchida nimic.

Link to comment
Share on other sites
  • 0
dOc MFX Experienced

+dOc MFX

Posted
Posted
14 minutes ago, Courage said:

Yes my friend, daca subforumul nu e citit, clasa css care se aplica este "unread" (definita in primul post din acest topic) in loc de "ipsDataItem_unread". So ... unde e greseala?

N-am stat sa rulez, nici n-am timp momentan, sunt la lucru. Dar daca vrei tu neaparat vad mai tarziu. Acel tag <li se inchide la {{endif}}>. Deci n-a uitat sa inchida nimic.

Din pacate am gresit eu, si imi asum, am luat tot codul din nou sa ma uit peste el.-.-

WWW.TECTONICPX.COM [ Professional Web Design Services ]

Link to comment
Share on other sites
  • 0
strong Experienced

+strong

Posted
Posted
16 hours ago, Courage said:

Yes my friend, daca subforumul nu e citit, clasa css care se aplica este "unread" (definita in primul post din acest topic) in loc de "ipsDataItem_unread". So ... unde e greseala?

N-am stat sa rulez, nici n-am timp momentan, sunt la lucru. Dar daca vrei tu neaparat vad mai tarziu. Acel tag <li se inchide la {{endif}}>. Deci n-a uitat sa inchida nimic.

Macar ai citit ce am scris acolo?

Am zis ca e gresit? eu doar am dat o poza la ce s-a referit doc + explicatia de ce a crezut ca e gresit.

 

— steam

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
 Share
Go to question listing

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.

  I accept