How could I make customised layout for my post list?
-
Hi there!
I have very limited background in coding.
I’m building a website for blog posts, and I would like to use Advanced Post List to create some lists where we can create some customisable layout.I’ve put my desired layout here .
I’ve been testing it out for almost an entire day. The text areas work just fine, and I was able to get it into 2 columns. However, the column padding between the image and the text doesn’t work like what I have expected.Also, I encountered an “error code 500” several times when I tried to insert an APL shourcode to my page. It usually works just fine for the first couple of times, but as I make adjustments for several times, it began to show this error code and says something like “your website has some critical issues”.
Here’s the HTML code I’ve been playing around yesterday (which is no longer in use because of the error code):
<div class="elementor-section-wrap"> <main class="elementor-section elementor-top-section elementor-element elementor-element-31a4675 elementor-section-content-top elementor-section-boxed elementor-section-height-default elementor-section-height-default" data-id="31a4675" data-element_type="section"> <div class="elementor-container elementor-column-gap-extended"> <div class="elementor-row"> <div class="elementor-column elementor-col-50 elementor-top-column elementor-element elementor-element-244f4aa" data-id="244f4aa" data-element_type="column"> <div class="elementor-column-wrap elementor-element-populated"> <div class="elementor-widget-wrap"> <div class="elementor-element elementor-element-4c0162c elementor-widget elementor-widget-image" data-id="4c0162c" data-element_type="widget" data-widget_type="image.default"> <div class="elementor-widget-container"> <div class="elementor-image"> <img src="[post_thumb size='large']"> </div> </div> </div> </div> </div> </div> <div class="elementor-column elementor-col-50 elementor-top-column elementor-element elementor-element-e86f85f" data-id="e86f85f" data-element_type="column"> <div class="elementor-column-wrap elementor-element-populated"> <div class="elementor-widget-wrap"> <div class="elementor-element elementor-element-f9cada5 elementor-widget elementor-widget-text-editor" data-id="f9cada5" data-element_type="widget" data-widget_type="text-editor.default"> <div class="elementor-widget-container"> <div class="elementor-text-editor elementor-clearfix"><p>[post_categories? delimiter=” | “]? — [post_date]</p></div> </div> </div> <div class="elementor-element elementor-element-67e0fd5 elementor-widget elementor-widget-text-editor" data-id="67e0fd5" data-element_type="widget" data-widget_type="text-editor.default"> <div class="elementor-widget-container"> <div class="elementor-text-editor elementor-clearfix"><h2>[post_title]</h2></div> </div> </div> <div class="elementor-element elementor-element-3e73c9d elementor-widget elementor-widget-text-editor" data-id="3e73c9d" data-element_type="widget" data-widget_type="text-editor.default"> <div class="elementor-widget-container"> <div class="elementor-text-editor elementor-clearfix"><p>[post_excerpt]</p></div> </div> </div> </div> </div> </div> </div> </div> </main> <section class="elementor-section elementor-top-section elementor-element elementor-element-49c13f8 elementor-section-boxed elementor-section-height-default elementor-section-height-default" data-id="49c13f8" data-element_type="section"> <div class="elementor-container elementor-column-gap-default"> <div class="elementor-row"> <div class="elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-ed7c058" data-id="ed7c058" data-element_type="column"> <div class="elementor-column-wrap elementor-element-populated"> <div class="elementor-widget-wrap"> <div class="elementor-element elementor-element-0140234 elementor-widget elementor-widget-divider" data-id="0140234" data-element_type="widget" data-widget_type="divider.default"> <div class="elementor-widget-container"> <div class="elementor-divider"> <span class="elementor-divider-separator"> </span> </div> </div> </div> </div> </div> </div> </div> </div> </section> </div>
FYI I use Elementor for layouts.
The page I need help with: [log in to see the link]
- The topic ‘How could I make customised layout for my post list?’ is closed to new replies.