Indeling berichten

Hallo allemaal,

Laatst zag ik op een site dat ze het kopje 'topics' en 'berichten' hadden weg gehaald en het vervangen hadden door dit;

Spoiler:

Graag zou ik willen weten hoe dit moet.

Groetjes,

Dit kan je doen door de templates aan te passen, hiervoor moet je wel de oprichter van het forum zijn. Controleer al eens of je deze kan aanpassen:

Beheerderspaneel Display Templates

Verder zou het ook handig zijn om te weten welke versie je hebt, phpBB2, punBB ...

Ik ben de oprichter van het forum en gebruik PunBB.

Oke, dan kunnen we beginnen met je template aan te passen  

We beginnen eerst met de template 'Index_box' te openen:

Beheerderspaneel Display Templates Index_box

Eerst gaan we de kolommen van 'aantal topics' en 'aantal posts' wegdoen, hiervoor moet je een aantal regels verwijderen.

• 15: < th class="tc2">{L_TOPICS}
  
• 16: < th class="tc3">{L_POSTS}
  
• 37: < td class="tc2">{catrow.forumrow.TOPICS}< /td>
  
• 38: < td class="tc3">{catrow.forumrow.POSTS}< /td>
  

Normaal als je het nu zou opslagen zie je enkel nog de kolom 'forum' en 'laatste bericht'.

Als de twee kolommen verwijderd zijn kunnen we beginnen met het aantal berichten en onderwerpen onder het laatste bericht te zetten.

---

Als je zelf nog zo iets zou maken zou ik eerst je code apart maken voor je ze in je template zet.

Ik begin dus met een leeg div element, hierdoor kan je later makkelijker de plaats wat aanpassen, geef ze dan wel een class mee bv: 'container_aantallen'. In de divider moet er natuurlijk nog iets in geplaatst worden, hierin zou ik nog 2 div's zetten, eentje voor je topics en eentje voor je posts, beide met class 'aantal'.
Nu plaatsen we de inhoud hierin, voor de aantallen moet je een variabelen gebruiken, deze kon je vinden in de regels die je verwijdert hebt, plak de variabelen in je div 'aantal', zet nog topics of posts achter de variabelen zodat je dit ook kan lezen op je forum. Je kan eventueel nog je cijfers vetjes laten uitkomen. Uiteindelijk krijg je dit als resultaat:

Code:

<div>
   <div class="aantal">
      <span>{catrow.forumrow.TOPICS}</span> topics
   </div>
   <div class="aantal">
      <span>{catrow.forumrow.POSTS}</span> posts
   </div>
</div>

De code die we juist gemaakt hebben moet onderaan de cel van 'laatste berichten' staan.
Regel 37-44 is de cel voor 'laatste berichten':

Code:

<td class="tcr">
   <span>
   <!-- BEGIN switch_topic_title -->
   <a href="{catrow.forumrow.U_LATEST_TOPIC}" title="{catrow.forumrow.LATEST_TOPIC_TITLE}">{catrow.forumrow.LATEST_TOPIC_NAME}</a><br />
   <!-- END switch_topic_title -->
   {catrow.forumrow.USER_LAST_POST}
   </span>
</td>

Vervang bovenstaande door deze:

Code:

<td class="tcr">
   <span>
   <!-- BEGIN switch_topic_title -->
   <a href="{catrow.forumrow.U_LATEST_TOPIC}" title="{catrow.forumrow.LATEST_TOPIC_TITLE}">{catrow.forumrow.LATEST_TOPIC_NAME}</a><br />
   <!-- END switch_topic_title -->
   {catrow.forumrow.USER_LAST_POST}
   </span>
   <div class="container_aantallen">
      <div class="aantal">
         <span>{catrow.forumrow.TOPICS}</span> topics
      </div>
      <div class="aantal">
         <span>{catrow.forumrow.POSTS}</span> posts
      </div>
   </div>
</td>

Sla dit op, normaal zie je nu het aantal posts en topics maar de tekst staan onder elkaar.

---

Dit gaan we oplossen dmv css, we gaan ook meteen de opmaak doen. Ga alvast naar de pagina om de css aan te passen:

Beheerderspaneel Display Plaatjes en Kleuren Kleuren Cascading Style Sheet

We beginnen met te zorgen dat er een wit-ruimte is tussen de tekst van het laatste bericht en het aantal posts. Roep je divider 'container_aantallen' en geef hem een margin.

Code:

.container_aantallen{
  margin: 5px 0px 40px 0px; /* lege ruimte buitenkant*/
}

Nu gaan we zorgen dat de tekstjes in een mooi vakje staan en ook naast elkaar weergeven worden. Al deze opmaak is persoonlijk, je kan ze zelf aannpassen naar jouw smaak.

Code:

.container_aantallen .aantal{
  background: #1f537b; /*achtergrond kleur*/
  color: #dedfdf; /*tekstkleur*/
  float: left; /*blokjes naast elkaar laten zweven*/
  padding: 5px; /*lege ruimte binnenkant*/
  margin: 3px; /* lege ruimte buitenkant*/
}

Als je nu nog het aantal posts of topics vet wil laten weergeven worden moet je nog een laatste css code maken.

Code:

.aantal span{
  font-weight: 900; /*dikte van de letters/cijfers*/
}

Het stukje met 'container_aantallen' kan ik niet vinden in mijn CCS. In welke regel moet dit ongeveer staan?

Volgens mij is het de bedoeling dat je de code gewoon in de CSS plakt en niet vervangt.

Ja, je moet het toevoegen aan je css, dat was misschien niet zo duidelijk :/

Oh oke, maar is er dan nog een bepaalde plek waar ik dat in de CSS moet plaatsen of maakt dat niet uit?

Dat maakt niet echt uit, maar je kan wel voor het jezelf makkelijk te maken het bij elkaar zetten en eventueel melden waarover het gaat:

Code:

/* --------- begin opmaak aantal posts en topics --------- */
.container_aantallen{
  margin: 5px 0px 40px 0px; /* lege ruimte buitenkant*/
}
.container_aantallen .aantal{
  background: #1f537b; /*achtergrond kleur*/
  color: #dedfdf; /*tekstkleur*/
  float: left; /*blokjes naast elkaar laten zweven*/
  padding: 5px; /*lege ruimte binnenkant*/
  margin: 3px; /* lege ruimte buitenkant*/
}
.aantal span{
  font-weight: 900; /*dikte van de letters/cijfers*/
}
/* --------- einde opmaak aantal posts en topics --------- */