Добавление недавнего сообщения в Wordpress с выделенным изображением и выдержками на сайт HTML

63
6

Я исследовал этот вопрос на нескольких форумах и нашел наиболее подходящий ответ здесь: Добавьте "Недавние сообщения" из блога wordpress на статическую страницу html.

То, что я ищу, - это расширение этого ответа, которое позволит мне включить изображение с изображением и post_excerpt. Я искал Google и этот форум, но безрезультатно. Любая помощь, которую вы можете предоставить, будет очень признательна.

Моя цель - включить фид RSS-типа на мой HTML-сайт, сделанный из моего блога, который находится в подкаталоге моего сайта.

Вышеупомянутый фрагмент PHP отлично подходит для отображения и привязки к последним сообщениям, однако я хотел бы отобразить как изображение с размеченным сообщением, так и выдержку в фиде.

спросил(а) 2021-01-25T15:12:28+03:00 4 месяца, 4 недели назад
1
Решение
63

Я нашел ответ на этот вопрос и хотел бы поделиться им с сообществом. Надеемся, что другие найдут это полезным.

Вот код, который мы использовали для создания желаемого эффекта:

<section class="feed float-right">
<h3>The Latest From Our Blog</h3>
<?php

include('blog/wp-load.php'); // Blog path

$args = array('showposts' => 4);

$the_query = new WP_Query( $args );

if( $the_query->have_posts() ):

echo '<ul>';

while ( $the_query->have_posts()) : $the_query->the_post();
echo '<li><a href="'.get_the_permalink().'">'.get_the_post_thumbnail().' '.get_the_title().'</a> <p>'.get_the_excerpt($limit).'</p></li>';
endwhile;

echo '</ul>';

endif;

wp_reset_query();

?>

</section>

Вышеупомянутый код помещается на страницу HTML или PHP, где вы хотите, чтобы канал отображался. Мы использовали разделы для этой реализации, но divs также будут работать. Информация о стиле была следующей:

.feed {
width: 100%;
height: 350;
padding-bottom: 25px;
}

.feed h3 {
width: 90%;
margin: 20px auto;
padding-left: 35px;
font-family: 'Open Sans Condensed', sans-serif;
font-size: 23px;
font-weight: 400;
color: #fff;
}

.feed ul {
width: 90%;
margin: auto;
list-style: none;
font-family: 'Open Sans Condensed', sans-serif;
font-size: 15px;
font-weight: 400;
color: #fff;
}

.feed ul li {
position: relative;
float: left;
width: 45%;
margin-bottom: 30px!important;
margin-right: 5%;
}

.feed ul li a {
color: inherit;
}

.feed ul li p {
line-height: 18px;
}

.attachment-post-thumbnail {
position: relative;
float: left;
width: 140px!important;
height: 90px!important;
margin: auto 30px 30px auto;
border-radius: 4px;
}

Вы можете посмотреть конечный результат здесь: https://www.moverspalmbeachcounty.com/

ответил(а) 2021-01-25T15:12:28+03:00 4 месяца, 4 недели назад
Ваш ответ
Введите минимум 50 символов
Чтобы , пожалуйста,
Выберите тему жалобы:

Другая проблема