Dynamic Latest Article Box w/image

  • I'm creating my homepage, and I'm trying to duplicate my current homepage.


    Here is a screenshot of my current homepage. It isn't really a "slider", it's 3 images that are the most "recently" created articles "featured images" loaded on the homepage. Below that, I have the 4 images of the articles that were in the top featured image box.


    Is it possible to recreate this with the page/box system?


    [Blocked Image: https://www.artofwargaming.net/screenshots/screen4.jpg]

  • So I'm playing around with this and I'm starting with the smaller boxes.


    I've created a page template, and I have been able to pull in the article from a category with this code:


    Code
    <div data-box-identifier="29"> {@$box->getContent()} </div>
    </div>


    However, when I go to add a second code with a different data-box-identifier, it gives me this result:




    It seems to duplicate the article box. Is there a way that I can have different boxes on the same page?

  • So after digging some more and playing this is the code I have, but it only displays box with ID 30 only and won't display the box with ID 29.


    Code
    <div class="col-md-4">
    <div data-box-identifier={@$box->identifier}> {if $box->boxID == 30}{@$box->getContent()} {/if} </div>
    </div>
    <div class="col-md-4">
    <div data-box-identifier={@$box->identifier}> {if $box->boxID == 29}{@$box->getContent()} {/if} </div>
    </div>
  • This is not how this works, boxes need to be assigned to the template in order to be accessible. In your particular case, $box is the exact same variable and therefore contains the same code. The default template gets invoked in a cycle for each box, hence it will be scoped to one box at a time before moving towards the next one.


    If you want to display multiple boxes, you must use them exactly the same way as it happens in the default templates.

    Alexander Ebert
    Senior Developer WoltLab® GmbH

  • This is not how this works, boxes need to be assigned to the template in order to be accessible. In your particular case, $box is the exact same variable and therefore contains the same code. The default template gets invoked in a cycle for each box, hence it will be scoped to one box at a time before moving towards the next one.


    If you want to display multiple boxes, you must use them exactly the same way as it happens in the default templates.


    Thanks for the reply.


    The default _box template is this:



    This is the "loop" you're referring to. Now the variable $box is in this loop. How do I change the $box variable so that I can display multiple boxes on the same page? This is the part I'm stuck on.



    Would it be easier to come up with new box positions inside of my custom page? I'm trying to figure out which way would make it more simplistic for creating a page with custom box locations.

  • This is the "loop" you're referring to.

    There is no loop, and that pretty much sums up your problem. The template itself doesn't contain the loop, but is instead invoked through PHP in a loop, each time with a different value for $box. Just assign the boxes you want to display onto the same placeholder.


    Also please keep in mind that you should be extra careful when editing the global box template, as it is used for literally every box, regardless of its position.

    Alexander Ebert
    Senior Developer WoltLab® GmbH

  • Thanks for the reply Alexander Ebert ,


    I'm new to this software and I'm trying to understand it. Thanks for your patience with me and taking the time to answer my post.


    So, I think I should take a new approach to this. My understanding is that this software uses event listeners. I'm not 100% sure what that is, but my understanding is it is the ability to add placeholders or inject html without editing the core files.


    In regards to what I'm trying to do, would it be best to create a new placeholder for boxes on this custom page? If so, how would I do this? I've searched the forums for documentation but I am either missing it or not typing in the correct search phrase.


    Thanks for your help again.

  • In regards to what I'm trying to do, would it be best to create a new placeholder for boxes on this custom page?

    I would like to go for a different approach and start over: What do you want to accomplish? This might sound like a stupid question, but I can suggest different approaches depending on your goals, instead of sending you on a journey with a generic, but less optimal way ;)


    Oh, and you can find the event listener in the developer documentation at: https://docs.woltlab.com/php_api_events.html. There is also a dedicated link in the page footer that guides you there.

    Alexander Ebert
    Senior Developer WoltLab® GmbH

  • Thanks again Alexander Ebert ,


    My ultimate goal is to reproduce my current website's homepage : https://www.artofwargaming.net


    The top section of my site, I'm sure I'll just have to hire a plugin developer to make it for me - maybe a custom box?

    It was suggested in my questions that I utilize the plugin - community bot - to accomplish my RSS import automation. I did ask the developer if it were possible in his new version to have rss item's imported into article categories and he did say he would look into implementing it.


    On my current page I have "boxes" that are news articles. Below the "featured images" are 4 boxes. Each one of these boxes are a different news item from the category "Featured News". They are offset by 1. So when new articles are imported, the show up from top to bottom. The big image is the most recently imported article, the two smaller images next to it are the next two most recently imported articles, and the 4 boxes beneath it are the next ones that were imported.


    Below that, I have 3 columns with two news articles in each column that are the most recently imported for that category. The columns are each different categories for different games my community members play.


    So , in the big picture, I would like to recreate my current website. I am pretty good with CSS/HTML, but I will admit I'm not php coder genius. I've almost reproduced the homepage with WCS. http://staging.artofwargaming.net is my current WCS installation


    Thanks again for helping me with this and providing feedback/suggestions.

  • The top section of my site […]

    This does require quite some work to get it done, mostly because you need a custom box controller that fetches the data. This is actually not that much of a big deal, as you can use existing box controllers (usually found in lib/system/box/ of the Core install directory), but still requires some understanding of the internal data structure. You might want to go through the docs, they should provide you with enough details to get started, and in case you're stuck somewhere, feel free to ask.


    I can answer your questions, but please understand that I'm lacking the time to guide you through every single step. At the end of the day, it is entirely up to you, if you want to do it yourself or hire an experienced developer - I won't blame you ;)

    Alexander Ebert
    Senior Developer WoltLab® GmbH

  • ....that is stunning.:thumbup: Reminds me of how Joomla can display content, perhaps something for Woltlab to consider for the future??

    I am a Newbie Admin. Please be gentle, I don't understand technical things.
    (Please can we have a full manual for this software)

  • ....that is stunning.:thumbup: Reminds me of how Joomla can display content, perhaps something for Woltlab to consider for the future??

    I just tweaked the CSS a bit. I'm still looking for a developer to develop the box with the dynamic images like I had on my Wordpress site. I'm also waiting for the author of the Community Bot to implement the RSS feed import to grab the image and set it as the featured image.