Simple Machines Community Forum

Customizing SMF => Tips and Tricks => Topic started by: Antes on April 25, 2020, 12:47:58 PM

Title: [Evil Production] Boxed Latest Topics
Post by: Antes on April 25, 2020, 12:47:58 PM
Paste this func. to the end of the BoardIndex.template file
function template_evil_latest_topics($settings) {
// Topics with header images and ugly text within...
// If this triggers any back-end developer, I won...
require_once('./SSI.php');
$quack = ssi_recentTopics($num_recent = 5, $exclude_boards = null, $include_boards = null, $output_method = 'array');
if (!empty($quack)) {
echo '<div id="topic_container">';
foreach ($quack as $quack_quack) {
$bg_img = $settings['theme_dir'] . '/images/' . $quack_quack['board']['id'] . '.jpg';
echo '
<div class="ph_topic_upper_holder">
<div class="topic_container" ' . (file_exists($bg_img) ? 'style="background-image: url(' . $settings['images_url'] . '/' . $quack_quack['board']['id'] . '.jpg)"' : '') . '>
<div class="ph_flex_end">
<div class="span_posted_board">' . $quack_quack['board']['link'] . '</div>
<div class="span_poster_link">' . $quack_quack['link'] . '</div>
</div>
</div>
<div class="poster_container">
<span class="grid_poster_user">
' . $quack_quack['poster']['link'] . '<br>
' . $quack_quack['time'] . '
</span>
</div>
</div>';
}
echo '</div>';
}
}

Code (Index.css) Select
/* CSS Part of the thingy I wrote */
#topic_container {
margin: 5px 0 10px 0;
display: flex;
flex-flow: row wrap;
justify-content: space-between;
}
.ph_topic_upper_holder {
flex: 0 19.5%;
display: inline-block;
}
.topic_container {
height: 200px;
background-size: contain;
display: flex;
flex-flow: row wrap;
border-radius: 3px 3px 0 0;
background-color: #534bca;
}
.topic_container .ph_flex_end {
flex: 1 100%;
align-self: flex-end;
padding: 0 0 5% 5%;
}
.span_posted_board {
margin: 0 0 10px 0;
}
.span_posted_board a, .span_poster_link a {
color: #FFF;
font-size: 1.25em;
padding: 4px;
}
.span_posted_board a {
background: orange;
border-radius: 3px;
}
.poster_container {
height: 50px;
background: #FFF;
border: 1px solid #CCC;
border-radius: 0 0 3px 3px;
padding: 2% 0 0 5%;
}


Now you can use template_evil_latest_topics($settings) somewhere you like... inside the BoardIndex.template : )

Remember if something is broken, its not my fault it was working last I checked... if its working good...

This Snip licensed under: MIT

Edit: license change per mod report:
Title: Re: [Evil Production] Boxed Latest Topics
Post by: Diego Andrés on April 27, 2020, 02:59:37 PM
Really nice
Title: Re: [Evil Production] Boxed Latest Topics
Post by: Antes on April 27, 2020, 03:02:09 PM
oh I forgot to mention, you need to put <board-id>.jpg (don't ask why I coded as JPG, you can always change to PNG) into theme's /images/ folder, otherwise it will show -purplish- background...
Title: Re: [Evil Production] Boxed Latest Topics
Post by: vbgamer45 on April 27, 2020, 03:10:07 PM
Nice. Would tie well into the custom board icons mods out there. Ever fancy to package it up as a mod? Just a couple tweaks.
Title: Re: [Evil Production] Boxed Latest Topics
Post by: Doug Heffernan on April 27, 2020, 04:26:36 PM
Very nice indeed. Good job @Antes.
Title: Re: [Evil Production] Boxed Latest Topics
Post by: Antes on April 27, 2020, 04:50:14 PM
Quote from: vbgamer45 on April 27, 2020, 03:10:07 PM
Nice. Would tie well into the custom board icons mods out there. Ever fancy to package it up as a mod? Just a couple tweaks.

Probably later, once I'm done with SMF 2.1 / smfCurve (MW Theme) and some other things.
Title: Re: [Evil Production] Boxed Latest Topics
Post by: vbgamer45 on April 27, 2020, 04:51:19 PM
Nice! Thanks for your contributions.
Title: Re: [Evil Production] Boxed Latest Topics
Post by: Antechinus on April 27, 2020, 05:23:22 PM
// If this triggers any back-end developer, I won...

:D :D :D :D :D :D