Web Design Blog / Programowanie:

Integracja strony z WordPress – przykłady

Funkcje integracji szablonu z WordPressem to element, którego chyba najbardziej brakuje na tym blogu. Już od jakiegoś czasu próbowałem zaplanować wpis, który byłby fajną instrukcją integracji szablonu statycznego z systemem WordPress. Uznałem, że to nie ma sensu bo każdy biznes lub developer ma swoje potrzeby. Postanowiłem za to zamieścić najważniejsze skrypty i każdy sobie wyciągnie to co będzie mu potrzebne.

Kickstart

Tworzymy własny theme a w nim umieszczamy pliki

  • style.css,
  • screenshot.png o wymiarach 1200x900px,
  • index.php,
  • opcjonalnie: functions.php

Zawartość pliku style.css:

/* 
Theme Name: Test
Theme URI: https://mansfeld.pl 
Author: Paweł Mansfeld
Author URI: https://mansfeld.pl 
Description: Skórka na rok 2018-2019 
Version: 1.0 
*/

Zawartość pliku functions.php:

<?php 

Uwaga!!! nie umieszczamy tagu zamykającego ?>

Od tej pory będzie można włączyć nasz motyw:

Obsługa miniaturek postów:

add_theme_support( 'post-thumbnails' );

the_post_thumbnail();

the_post_thumbnail('thumbnail'); // Miniatura (domyślnie 150px x 150px)
the_post_thumbnail('medium'); // Średnia rozdzielczość (domyślnie 300px x 300px)
the_post_thumbnail('large'); // Duża rozdzielczość (domyślnie 1024px x 1024px)
the_post_thumbnail('full'); // Oryginalna rozdzielczość (brak modyfikacji)

Rozmiary w pikselach edytujemy w Zapleczu (Ustawienia > Media > Rozmiar miniatury)

 

Pobieranie listy postów

global $post;
$args = array('posts_per_page'=>12, 'offset' => 0);

$myposts = get_posts( $args );
foreach ( $myposts as $post ) : setup_postdata( $post ); ?>

<article class="" data-background="<?php the_post_thumbnail_url('medium'); ?>">
<span class="kategoria">
<a href="<?php bloginfo('wpurl') ?>/<?php echo get_the_category()[0]->slug; ?>"><?php echo get_the_category()[0]->cat_name; ?></a>
</span>
<a href="<?php the_permalink(); ?>"><h3><?php the_title(); ?></h3></a>
<?php echo get_the_date('j F Y'); ?> autor: <?php echo get_the_author(); ?>
</article>

<?php endforeach;
wp_reset_postdata();

Tworzenie szablonu

/*
Template Name: Blog
*/

Pobieranie nazwy witryny – przykład title

<title> <?php echo get_the_title(); ?> - <?php bloginfo('name');?></title>

Szablony specjalne

Tag

wystarczy nazwać plik szablonu tag.php
Pobieranie tagu:

<?php single_tag_title(); ?>

Listowanie artykułów z tagiem:

$thistag_id = get_queried_object()->term_id;

global $post;
$args = array('tag_id'=> $thistag_id, 'posts_per_page'=>32);

$myposts = get_posts( $args );
foreach ( $myposts as $post ) : setup_postdata( $post ); ?>

//tutaj wykorzystujemy pętlę analogicznie jak w listingu artykułów get_the_title() itd...

<?php endforeach;
wp_reset_postdata();?>

Kategoria

wystarczy nazwać plik szablonu category.php
Pobieranie kategorii:

<?php single_category_title(); ?>

Pobieranie artykułów tej kategorii:

<?php
$categories = get_the_category();
$category_id = $categories[0]->cat_ID;

global $post;
$args = array('category'=> $category_id, 'posts_per_page'=>32);

$myposts = get_posts( $args );
foreach ( $myposts as $post ) : setup_postdata( $post ); ?>

//tutaj wykorzystujemy pętlę analogicznie jak w listingu artykułów get_the_title() itd...

<?php endforeach;
wp_reset_postdata();?>

Błąd 404

wystarczy nazwać plik szablonu 404.php

Szablon artykułu

wystarczy nazwać plik szablonu single.php

Poprzedni i następny post (propozycja):

<?php
$prev_post = get_previous_post();
if (!empty( $prev_post )): ?>

<a class="prev-post" href="<?php echo esc_url( get_permalink( $prev_post->ID ) ); ?>"><?php echo esc_attr( $prev_post->post_title ); ?></a>

<?php endif ?>

<?php

$next_post = get_next_post();
if (!empty( $next_post )): ?>

<a class="next-post" href="<?php echo esc_url( get_permalink( $next_post->ID ) ); ?>"><?php echo esc_attr( $next_post->post_title ); ?></a>

<?php endif; ?>

Pobieranie treści artykułu (content)

<?php if(have_posts()) : ?>
<?php while(have_posts()) : the_post(); ?> 
<?php the_content(); ?>
<?php $author = get_the_author_posts_link(); ?>
<?php endwhile; ?>
<?php endif; ?> 

Pobieranie nagłówka, paska bocznego i stopki

Includowanie plików header.php, sidebar.php, footer.php. Można też użyć normalnej funkcji include.

<?php get_header(); ?>

<?php get_sidebar(); ?>

<?php get_footer(); ?>

Oznaczenie sekcji head i footer (dla wtyczek)

(...)

<?php wp_head(); ?>

</head>

(...)

<?php wp_footer(); ?>

</body>

(...)

Deklaracja shortcode z tagiem otwierającym i zamykającym bez atrybutów

Przykład bootstrapowego „row”

function row_sc( $atts, $content = null ) {
extract(shortcode_atts(array(), $atts));
$rowcontent = do_shortcode($content);
return <<<EOT
<div class="row">
$rowcontent
</div>
EOT;
}

add_shortcode("row", "row_sc");

Komentarze

Wyświetlanie komentarzy w pojedynczym artykule

<div class="comments">

<?php
//Pobieramy tylko zaakceptowane w panelu komentarze
$args = array(
'status' => 'approve',
'post_id' => $thispostid
);

$comments_query = new WP_Comment_Query;
$comments = $comments_query->query( $args );

if ( $comments ) {
foreach ( $comments as $comment ) {

?>


<div class="single-comment">
<h4><?php comment_author(); ?></h4><span><?php comment_date(); ?></span>
<p><?php echo $comment->comment_content; ?> </p>
</div>
<?php

}
} else {
echo 'Brak komentarzy.';
}
?>

</div>

Wzór formularza do dodawania komentarzy

<form action="https://domenastrony.pl/wp-comments-post.php" method="post">
 <input type="text" name="author" placeholder="Podpis:" value=""/ required>
 <input type="text" name="email" placeholder="E-mail:" value=""/ required>
 <textarea name="comment" placeholder="Komentarz:" required></textarea>
 <input type='hidden' name='comment_post_ID' value='<?php echo $thispostid; ?>' id='comment_post_ID' />
 <input type='hidden' name='comment_parent' id='comment_parent' value='0' />
 <input name="submit" type="submit" value="Opublikuj" class="btn" href="#">
</form>
Integracja strony z WordPress – przykłady
4.6 (92.73%) głosów: 11

Autor: (29 lat)

Służę pomocą w razie wykonania / odnowienia strony lub sklepu internetowego dla twojej firmy niezależnie od twojej lokalizacji czy skali przedsięwziecia.

Tego typu wpisy piszę w wolnych chwilach lub pomiędzy projektami. Tylko pomyśl co mogę dla Ciebie zrobić w ramach usługi :-)

Otrzymuj powiadomienie o nowych artykułach

*Bez obaw, nie udostępniam nikomu twojego adresu e-mail