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.7 (94.12%) głosów: 17

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 :-)

Zadaj pytanie lub skomentuj

Wyrażam zgodę na przetwarzanie moich danych osobowych przez firmę Paweł Mansfeld z siedzibą w Jastrzębiu-Zdroju, ul. Plebiscytowa 10, w celu udzielenia odpowiedzi, w tym przedłożenia oferty jeśli o nią pytam. Moje dane osobowe będą przetwarzane do czasu cofnięcia zgody lub przez okres niezbędny do ustalenia, dochodzenia lub obrony roszczeń. Mam prawo dostępu do danych, sprostowania, usunięcia lub ograniczenia przetwarzania, prawo sprzeciwu, prawo wniesienia skargi do organu nadzorczego i prawo do przeniesienia danych.

Komentarze publiczne

Brak komentarzy.
Otrzymuj powiadomienie o nowych artykułach

Wyrażam zgodę na przetwarzanie moich danych osobowych przez firmę Paweł Mansfeld z siedzibą w Jastrzębiu-Zdroju, ul. Plebiscytowa 10, w celu udzielenia odpowiedzi, w tym przedłożenia oferty jeśli o nią pytam. Moje dane osobowe będą przetwarzane do czasu cofnięcia zgody lub przez okres niezbędny do ustalenia, dochodzenia lub obrony roszczeń. Mam prawo dostępu do danych, sprostowania, usunięcia lub ograniczenia przetwarzania, prawo sprzeciwu, prawo wniesienia skargi do organu nadzorczego i prawo do przeniesienia danych.

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