Staff replied Templates

THEMIS - Article layout

Asked by TomaszGrzechnik 5 years ago Last activity 5 years ago

Hi,
Is it possible to change article layout in THEMIS Template?
Now is :
First Article: Image/date/title/intro/category
Second Article:Date/title/intro/category/image
Third:Image/date/title/intro/category
Fourth:Article:Date/title/intro/category/image

I want to get layout for all articles like in first:Image/date/title/intro/category

In Template documentation is:only one addon was overridden inside the template:

Articles  (admin & front view)

What I should change?

9 replies

Rashida Rahman Staff

5 years ago

Hi there!

Thanks for your query.

Would you please give me your site URL here, so that I can try to gather some CSS it it helps?

You want the change for you Blog listing page, right?

Best Regards

TomaszGrzechnik Asked this

5 years ago

Hi,
There is address test page:
https://test.altair.pro-linuxpl.com

I need to make changes here:https://test.altair.pro-linuxpl.com/aktualnosci-2

I need to get the same view of all articles
1.Image
2. Publish date
3. Title
4. Intro
5. Category

And why there is no "Show more..." i menu options I switch to on
<div class="readmore" is bottom ofdate in the same place- strange?
I need button on the bottom

Rashida Rahman Staff

5 years ago

Hi,

Please use the following code in your custom.css file:

.article-list .article {
    display: flex;
    flex-direction: column;
}
.article-list .article .article-body {
    order: 2;
}

Hope this will give you your desired order there.

For your read more button, please enable it and then give me a redirection to the issue.

Best Regards

TomaszGrzechnik Asked this

5 years ago

Thanks Rashida :)
Your code works!!!

Regarding "Read more" you can see that title from article is visible, but in the same line with publish date.
Please check:https://test.altair.pro-linuxpl.com/aktualnosci-2
If you pint mouse on line with date tilte is hover.

I need to move read more below intro text, can you help me?

Rashida Rahman Staff

5 years ago

Hi,

Here is the code:

.article-list .article .readmore {
    order: 2;
}
.article-list .article .readmore a {
    color: #1b6be4;
}

I have changed the color from white so that it can be visible all time...you can change the color to your desired one.

Best Regards

TomaszGrzechnik Asked this

5 years ago

Thanks Rashida, You are Great!!!

All custoizations works perfectly!!!

But I have next question:
I made module (SP Page Builder) with image to show on top of article list and singe artilce. In article list all is ok - you can see image with bridge at night :https://test.altair.pro-linuxpl.com/aktualnosci-2
But when I open single article there is no image...
How to show in Title position this module?

Rashida Rahman Staff

5 years ago

Hello,

Thanks for your appreciations:)

Here is the necessary code:

.view-article #sp-title {
    display: block;
}

Hope this will solve the issue for you.

Best Regards

TomaszGrzechnik Asked this

5 years ago

Thanks again Rashida, all is OK :)

Rashida Rahman Staff

5 years ago

You are always welcome:)

You may mark resolve the most useful answer to close the post I guess...