Οι λέξεις κλειδιά είναι ίσως το σημαντικότερο κομμάτι του on-page SEO. Η σωστή χρήση τους επηρεάζει την ιστοσελίδα σας στο μεγαλύτερο βαθμό από όλους τους άλλους παράγοντες που έχουμε ήδη αναφέρει. Πως όμως μπορεί να γίνει σωστή χρήση σε λέξεις κλειδιά αν δεν εντοπίσετε πρώτα τις σωστές!

Αφού έχετε καταγράψει όλες τις πιθανές λέξεις κλειδιά μπορείτε να τις προσθέσετε στο Keyword Tool της Google ώστε να δείτε τις σας προτείνει και να πάρετε νέες ιδέες. Επίσης μπορείτε να ψάξετε στο Google για αυτές τις λέξεις κλειδιά να σημειώσετε τα πρώτα αποτελέσματα και να περιηγηθείτε σε αυτές τις ιστοσελίδες που βγαίνουν πρώτες ώστε να πάρετε ιδέες και να δείτε πως λειτουργούν αυτές.

Πολλοί αγνοούν πλήρως αυτή τη διαδικασία ή την αναβάλουν για αργότερα. Η αναζήτηση των λέξεων κλειδιά είναι μια πάρα πολύ σημαντική διαδικασία και αποτελεί το θεμέλιο για την ιστοσελίδα σας. Μπορεί φυσικά να γίνει και σε μια ήδη υπάρχουσα ιστοσελίδα αλλά τότε τα πράγματα είναι πολύ πιο χρονοβόρα και καλό είναι εφόσον υπάρχει η δυνατότητα να γίνεται πριν από την κατασκευή της ιστοσελίδας.

Αφού λοιπόν σημειώσετε όλες τις λέξεις κλειδιά που σας ενδιαφέρουν στα επόμενα μέρη του tutorial θα δούμε πως θα κάνουμε πλήρη χρήση αυτών.

Μερικές βασικές ρυθμίσεις στο WordPress

Αφού συνδεθούμε στην διαχείριση του WordPress (todomainsas.gr/wp-admin) πάμε στο μενού «Ρυθμίσεις». Πατώντας στο «Γενικά» γράφουμε τον τίτλο του blog μας και μια μικρή περιγραφή για αυτό επιλέγουμε την σωστή ώρα και το πώς θέλουμε να εμφανίζεται η ημερομηνία και η ώρα στα άρθρα που δημιουργούμε.

Προσοχή: Μην αλλάξετε τα πεδία URL εγκατάστασης και URL ισοτόπου!

Μόνιμοι Σύνδεσμοι (Permalinks)

Οι μόνιμοι σύνδεσμοι είναι ο τρόπος με τον οποίο θα εμφανίζονται τα διάφορα urls στο blog σας. Αυτό περιλαμβάνει τις διευθύνσεις των άρθρων σας, των σελίδων σας, των ετικετών (tags) κλπ.

Για να έχετε ένα SEO Optimized blog θα πρέπει να αλλάξετε αυτές τις ρυθμίσεις ώστε να εμφανίζονται λέξεις κλειδιά στα urls της ιστοσελίδας σας και όχι απλά αριθμοί. Ας δούμε όμως ποιες επιλογές μας δίνει το WordPress. Μεταβείτε στο μενού Ρυθμίσεις -> Μόνιμοι Σύνδεσμοι:

Όπως βλέπετε το WordPress μας δίνει ήδη την δυνατότητα να χρησιμοποιήσουμε κάποιον από τους ήδη υπάρχοντες τρόπους εμφάνισης των urls (Προεπιλογή, Ημέρα και όνομα, Μήνας και όνομα, Αριθμός) ή να ορίσουμε εμείς πως θα εμφανίζονται τα urls των άρθρων μας. Αυτό γίνεται μέσω της χρήσης κάποιων έτοιμων shortcodes τα οποία είναι:

%year%: Το έτος δημιουργίας του άρθρου (πχ: 2012)
%monthnum%: Ο μήνας δημιουργίας του άρθρου (πχ: 1,…,12 )
%day%: Η ημέρα δημιουργίας του άρθρου (πχ: 1,…,31)

%postname%: Ο τίτλος του άρθρου ή ότι έχουμε ορίσει εμείς στο πεδίο μόνιμος σύνδεσμος (post slug) μέσα στο κάθε άρθρο. Θα δούμε πιο αναλυτικά στην συνέχεια πως χρησιμοποιούμε το %postname% που είναι το πιο σημαντικό από SEO άποψη όσων αφορά τους μόνιμους συνδέσμους.

%post_id%: Το ID του άρθρου που είναι μοναδικό για κάθε άρθρο. (πχ 423)

%category%: Ο τίτλος της κατηγορίας που ανήκει το άρθρο (και πάλι εδώ εμφανίζεται ότι έχουμε ορίσει στο σύντομο όνομα της κατηγορίας).

%author%: το όνομα του αρθρογράφου.

Περισσότερες επιλογές για τους μόνιμους συνδέσμους μπορείτε να βρείτε στο Codex του WordPress.

Για να ορίσουμε λοιπόν τον τρόπο με τον οποίο θέλουμε να εμφανίζονται οι διευθύνσεις των άρθρων μας αρκεί να συμπληρώσουμε στο πεδίο Προσαρμοσμένη δομή αυτό που επιθυμούμε. Για να είναι SEO Optimized τα urls σας θα πρέπει οπωσδήποτε να χρησιμοποιήσετε το %postname%.

Βασικοί κανόνες που ακολουθούμε πάντα:

1. Πρέπει πάντα να ξεκινάμε με μια κάθετο /
2. Χωρίζουμε τα shortcodes μεταξύ τους με την χρήση των συμβόλων: / – _
3. Μπορούμε να προσθέσουμε οτιδήποτε άλλο θέλουμε όπως για παράδειγμα να βάλουμε στο τέλος .html ή .php

Ας δούμε μερικά παραδείγματα:

Υποθέτουμε πως έχουμε ένα άρθρο τίτλο «Το πρώτο μου ποστ» με μόνιμο σύνδεσμο (post slug) to-proto-moy-post, ανήκει στην κατηγορία «Γενικά» που έχει σαν category-slug το genika. Το άρθρο δημιουργήθηκε στις 24 / 10 / 2011 και έχει id το νούμερο 4567. Ας παίξουμε τώρα λίγο με μερικούς πιθανούς τρόπους που θα μπορούσε να εμφανίζεται το url αυτού του άρθρου (θυμίζουμε ξανά! ΠΑΝΤΑ πρέπει να περιλαμβάνετε το %postname% για να είναι το url SEO Optimized)

/%postname% -> http://todomain.gr/to-proto-moy-post

/%postname%-%post_id% -> http://todomain.gr/to-proto-moy-post-4567

/%category%/%postname%.html -> http://todomain.gr/genika/to-proto-moy-post

/%year%/%monthnum%/%postname%-%post_id%.html -> http://todomain.gr/2011/10/to-proto-moy-post-4567.html

Όπως βλέπετε οι επιλογές είναι πάρα πολλές. Από άποψη SEO το καλύτερο είναι το /%category%/%postname% ώστε να περιλαμβάνονται λέξεις κλειδιά πάντα.

Πως ορίζουμε τα σύντομα ονόματα των άρθρων και των κατηγοριών

Στην επεξεργασία του άρθρου θα παρατηρήσετε που κάτω από των τίτλο μας δίνει το WordPress την επιλογή να ορίσουμε εμείς τι θα εμφανίζεται σαν %postname%

Πατώντας το κουμπάκι Επεξεργασία μπορούμε να γράψουμε ότι θέλουμε και μετά να το αποθηκεύσουμε, και αυτός θα είναι πλέον ο μόνιμος σύνδεσμος για το άρθρο.

Στις κατηγορίες ισχύει το ίδιο και θα εμφανίζεται όταν καλείται το %category% ότι έχουμε γράψει το πεδίο σύντομο όνομα.

Το θέμα των permalinks σε μια ιστοσελίδα είναι πάρα πολύ σημαντικό και τα SEO Optimized url μπορούν να βοηθήσουν πάρα πολύ στην καλύτερη κατάταξή σας στις μηχανές αναζήτησης. Πάντα να βάζετε μια λέξη κλειδί στον μόνιμο σύνδεσμο του άρθρου σας και να προσπαθείτε να δίνετε στον χρήστη μια σύντομη εικόνα του τι πρόκειται να διαβάσει. Για παράδειγμα αν το άρθρο σας έχει τίτλο «Πώς να διαγράψετε το προφίλ σας στο Facebook» μπορείτε να χρησιμοποιήσετε σαν post slug το diagrafi-profil-facebook

Tip: Αποφεύγετε να χρησιμοποιείτε προθέσεις, άρθρα, επιρρήματα στο post slug, δηλαδή, λέξεις όπως το «και», «το», «οι», «δεν», «για» κλπ καλό είναι να τις παραλείπετε.

Σήμερα είδαμε μερικές από τις πιο γνωστές δυνατότητες του WordPress που αφορούν το SEO (τη δύναμη των permalinks που μας την προσφέρει απλόχερα χωρίς την χρήση πολύπλοκων γραμμών κώδικα μέσα στο αρχείο .htaccess). Στο επόμενο μέρος θα μιλήσουμε για μια άλλη καταπληκτική λειτουργία του WordPress, τα Ping Services καθώς και την δημιουργία Sitemaps.

Ας προσθέσουμε λοιπόν έναν jQuery Slider (σαν αυτόν που θα βρούμε στο WDDC.gr) πάνω από τα άρθρα μας στην κεντρική σελίδα. Αυτό δεν το κάνουμε επειδή είναι 100% αναγκαίο αλλά περισσότερο για εξάσκηση. Ανοίγουμε το header.php και προσθέτουμε ακριβώς κάτω από το

<?php wp_head(); ?>

τον κώδικα

<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/jquery.innerfade.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/jquery.functions.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/functions.js"></script>

Ο παραπάνω κώδικας φορτώνει τα αρχεία της jQuery από τον φάκελο js (Όλα τα js αρχεία συμπεριλαμβάνονται στο τέλος του άρθρου όπου και μπορείτε να κατεβάσετε το θέμα ολοκληρωμένο). Μετά ανοίγουμε το index.php και κάτω από την γραμμή

<div id="content">

προσθέτουμε τον κώδικα

<div id="gallery-bg">
<div id="gallery-bgtop">
<div id="gallery-bgbtm">
<h2>Τελευταία Άρθρα</h2>
<div id="featured">
<?php
$featured = new WP_Query();
$featured->query('category_name=Featured');
?>
<?php while ($featured->have_posts()) : $featured->the_post(); ?>
<div class="slider">
<div class="thumbnail">
<?php the_post_thumbnail( 'single-post-thumbnail' ); ?>
</div>
<div class="title">
<h1><a href="<?php the_permalink() ?>" title="<?php the_title(); ?>"><?php the_title(); ?></a></h1>
</div>
<div class="arrow"></div>
</div>
<?php endwhile; ?>
</div>
</div>
</div>
</div>

O παραπάνω κώδικας απαιτεί να έχουμε δημιουργήσει μια κατηγορία με το όνομα Featured. Έτσι πλέον τα άρθρα που έχουμε προσθέσει στην κατηγορία Featured, εμφανίζονται σε ένα slideshow με την εικόνα και τον τίτλο τους, ενώ ο τίτλος είναι link στο άρθρο.

Αυτό ήταν. Πλέον τον θέμα μας έχει όλες τις σελίδες που χρειαζόμαστε, πλήρη λειτουργικότητα, και έναν κομψό jQuery Slider στην κεντρική μας σελίδα.

Για να μην σας κουράζουμε με άσκοπο κώδικα, όλες οι στυλιστικές αλλαγές και οι εικόνες, περιέχονται στο αρχείο style.css μαζί με όλα τα υπόλοιπα αρχεία στο θέμα μας το οποίο μπορείτε να κατεβάσετε ολοκληρωμένο από εδώ

Στο τέλος του άρθρου μπορείτε να βρείτε όλα τα αρχεία που έχουμε κάνει μέχρι τώρα και όλα όσα θα κάνουμε σε αυτό το μέρος.

Ας προχωρήσουμε λοιπόν και ας προσθέσουμε εικόνες στα άρθρα μας. Για να το κάνουμε αυτό θα χρησιμοποιήσουμε έναν πολύ απλό τρόπο, που χρησιμοποιούν πολλά θέματα σήμερα. Θα δημιουργήσουμε ένα νέο αρχείο με το όνομα functions.php. Μέσα σε αυτό θα γράψουμε τον εξής κώδικα

<?php
add_theme_support( 'post-thumbnails' );
set_post_thumbnail_size( 610, 150, true );
?>

Μετά από αυτό, θα πάμε στο αρχείο index.php και θα βρούμε την γραμμή

<?php the_excerpt(); ?>

και ακριβώς από πάνω της θα γράψουμε

<div class="post-thumb">
<?php the_post_thumbnail(); ?>
</div>

το ίδιο θα κάνουμε και στο αρχείο single.php. Θα βρούμε όμως την γραμμή

<?php the_content(); ?>

και ακριβώς από πάνω της θα γράψουμε

<div class="post-thumb">
<?php the_post_thumbnail(); ?>
</div>

Έτσι τώρα, το WordPress συμπεριλαμβάνει και μια νέα λειτουργία κατά την εγγραφή ενός νέου άρθρου. Κάτω δεξιά θα μας εμφανίζεται ένα νέο μενού με το όνομα Post Thumbnail. Πατάμε λοιπόν Set thumbnail και κάνουμε upload μια φωτογραφία (στο θέμα μας θα είναι μεγέθους 610×150 pixels) και πατάμε Use as thumbnail. Αυτό ήταν. Πλέον στα άρθρα μας θα έχουμε και την εικονίτσα μας

Ας δούμε τώρα τι μπορούμε να κάνουμε για τα σχόλια στα άρθρα μας. Αυτήν την στιγμή χρησιμοποιούμε το προεγκατεστημένο τρόπο εμφάνισης για τα σχόλια, ο οποίος είναι αρκετά καλός. Όμως ίσως θέλουμε περισσότερα. Δημιουργούμε ένα νέο αρχείο με το όνομα comments.php. Αυτό το αρχείο θα μας δώσει περισσότερο έλεγχο στα σχόλια μας. Ο κώδικας που περιέχει είναι μεγάλος, και γι’αυτό τον λόγω απλά το συμπεριλαμβάνουμε στο zip που θα βρείτε στο τέλος του άρθρου με όλα τα αρχεία.

Ας φτιάξουμε τώρα μια φόρμα αναζήτησης. Δημιοθργούμε ένα νέο αρχείο με το όνομα searchform.php και γράφουμε

<form method="get" id="search_form" action="<?php bloginfo('home'); ?>/">
<div>
<input type="text"  name="s" id="s" class="search"/>
<input type="submit" id="searchsubmit" value="Search" />
</div>
</form>

‘Επειτα δημιουργούμε ένα νέο αρχείο και το ονομάζουμε search.php. Μέσα σε αυτό γράφουμε

<?php get_header(); ?>
<div id="content">
<?php if (have_posts()) : ?>
<?php while (have_posts()) : the_post(); ?>
<h2>Αποτελέσματα Αναζήτησης</h2>
<div class="post" id="post-<?php the_ID(); ?>">
<h2 class="title"><a href="<?php the_permalink() ?>" rel="bookmark" title="Σύνδεσμος στο <?php the_title_attribute(); ?>"><?php the_title(); ?></a></h2>
<p class="meta"><span><?php the_time('F jS, Y') ?></span><span>Από τον/την&nbsp;<?php the_author() ?></span></p>
<div>
<?php the_post_thumbnail(); ?>
</div>
<?php the_excerpt(); ?>
<div class="entry">
<p class="links">
<a href="<?php the_permalink() ?>" rel="bookmark" title="Σύνδεσμος στο <?php the_title(); ?>" class="more" >Περισσότερα...</a>
<b>&nbsp;&nbsp;&nbsp;&nbsp;|&nbsp;&nbsp;&nbsp;&nbsp;</b>
<?php comments_popup_link('Κανένα σχόλιο', '1 Σχόλιο', '% Σχόλια', 'σχόλια'); ?>
</p>
</div>
</div>
<?php endwhile; ?>
<div class="navigation">>
<div class="alignleft"><?php next_posts_link('&laquo; Παλαιότερα Άρθρα') ?></div>
<div class="alignright"><?php previous_posts_link('Νεότερα Άρθρα &raquo;') ?></div>
</div>
<?php else : ?>
<h2 class="center">Δεν βρέθηκε</h2>
<p class="center">Λυπούμαστε αλλά αυτό που ψάχνετε δεν βρέθηκε.</p>
<?php endif; ?>
</div>
<?php get_sidebar(); ?>
<?php get_footer(); ?>

Τέλος προσθέτουμε στο header.php εκεί που θέλουμε να εμφανίσουμε την φόρμα αναζήτησης την εξής γραμμή

<div id="searchform">
<?php get_search_form(); ?>
</div>

Πλέον η ιστοσελίδα μας είναι πλήρως λειτουργική. Με άρθρα και σελίδες, σχόλια, πλαϊνή μπάρα, φόρμα αναζήτησης και εικόνες στα άρθρα.

Μπορείτε να κατεβάσετε το θέμα με ότι έχουμε κάνει μέχρι τώρα εδώ

Να σημειώσουμε ότι έχουμε προσθέσει κάποιες εικόνες και έχουμε κάνει στυλιστικές αλλαγές στο θέμα μας.

Στο επόμενο και τελευταίο μέρος, θα κάνουμε τις τελικές αλλαγές μας, θα δούμε το θέμα μας live και εκγατεστημένο και θα κάνουμε τον επίλογο σε αυτήν την σειρά βοηθημάτων.

Ξεκινάμε λοιπόν και δημιουργούμε ένα αρχείο με το όνομα page.php. Αυτό το αρχείο θα χειριστεί όλες τις στατικές μας σελίδες. Έτσι γράφουμε:

<?php get_header(); ?>
<div id="content">
<?php if (have_posts()) : ?>
<?php while (have_posts()) : the_post(); ?>
<div class="post" id="post-<?php the_ID(); ?>">
<h2 class="title"><a href="<?php the_permalink() ?>" rel="bookmark" title="Σύνδεσμος στο <?php the_title_attribute(); ?>"><?php the_title(); ?></a></h2>
<div class="entry">
<?php the_content(); ?>
</div>
</div>
<?php endwhile; ?>
<?php else : ?>
<h2 class="center">Δεν βρέθηκε</h2>
<p class="center">Λυπούμαστε αλλά αυτό που ψάχνετε δεν βρέθηκε.</p>
<?php endif; ?>
</div>
<?php get_sidebar(); ?>
<?php get_footer(); ?>
</body>
</html>

Ο παραπάνω κώδικας, καλεί το header.php ,μετά χρησιμοποιεί το Loop, και μας εμφανίζει τον τίτλο, τα στοιχεία του άρθρου, και το απόσπασμα. Μετά μας εμφανίζει έναν σύνδεσμο για το πλήρες άρθρο, και τον αριθμό των σχόλιων. Τέλος μας εμφανίζει συνδέσμους για τα προηγούμενα και τα νεότερα άρθρα (αν υπάρχουν) και ένα μήνυμα λάθους άν δεν βρεθεί τίποτα. Στο τέλος του κώδικα μας καλούμε τα αρχεία sidebar.php και footer.php.
Έτσι κάθε φορά που το WordPress θα εμφανίζει μια σελίδα, θα καλεί το αρχείο που μόλις δημιουργήσαμε.

Τώρα θα δημιουργήσουμε ένα αρχείο με όνομα single.php το οποίο θα χειρίζεται την εμφάνιση των άρθρων μας (του μη στατικόυ περιεχομένου μας). Έτσι γράφουμε:

<?php get_header(); ?>
<div id="content">
<?php if (have_posts()) : ?>
<?php while (have_posts()) : the_post(); ?>
<div class="post" id="post-<?php the_ID(); ?>">
<h2 class="title"><a href="<?php the_permalink() ?>" rel="bookmark" title="Σύνδεσμος στο <?php the_title_attribute(); ?>"><?php the_title(); ?></a></h2>
<p class="meta"><span><?php the_time('F jS, Y') ?></span><span>Από τον/την&nbsp;<?php the_author() ?></span></p>
<div class="entry">
<?php the_content(); ?>
</div>
</div>
<?php comments_template(); ?>
<?php endwhile; ?>
<div class="navigation">
<div class="alignleft"><?php next_posts_link('&laquo; Παλαιότερα Άρθρα') ?></div>
<div class="alignright"><?php previous_posts_link('Νεότερα Άρθρα &raquo;') ?></div>
</div>
<?php else : ?>
<h2 class="center">Δεν βρέθηκε</h2>
<p class="center">Λυπούμαστε αλλά αυτό που ψάχνετε δεν βρέθηκε.</p>
<?php endif; ?>
</div>
<?php get_sidebar(); ?>
<?php get_footer(); ?>
</body>
</html>

Ο παραπάνω κώδικας, καλεί το header.php ,μετά χρησιμοποιεί το Loop, και μας εμφανίζει τον τίτλο, τα στοιχεία του άρθρου, και το περιεχόμενο μας. Μετά συμπεριλαμβάνουμε το υπάρχον αρχείο για τα σχόλια. Μετά μας εμφανίζει έναν σύνδεσμο για το πλήρες άρθρο, και τον αριθμό των σχόλιων. Τέλος μας εμφανίζει συνδέσμους για τα προηγούμενα και τα νεότερα άρθρα (αν υπάρχουν) και ένα μήνυμα λάθους άν δεν βρεθεί τίποτα. Στο τέλος του κώδικα μας καλούμε τα αρχεία sidebar.php και footer.php.

Μπορείτε να κατεβάσετε τα αρχεία αυτού του βοηθήματος εδώ

Στο επόμενο βοήθημα θα δούμε τα υπόλοιπα αρχεία και θα κάνουμε τις τελικές μας στυλιστικές αλλαγές.

Τα αρχεία και οι φάκελοι μας έχουμε ήδη εξηγήσει τι κάνουν το καθένα από αυτά. Να προσθέσουμε τους φακέλους styles και js όπου θα περιέχουν επιπλέον αρχεία στύλ καθώς και αρχεία jQuery για να κάνουμε την σελίδα μας ακόμα πιο όμορφη.

Ξεκινάμε λοιπόν δημιουργώντας τα αρχεία index.php και style.css. Αυτά τα δυο είναι απόλυτως βασικά και απαραίτητα για το θέμα μας. Ανοίγουμε το index.php για να γράψουμε τον πρώτο μας κώδικα. Η πρώτη και βασική εντολή που θα γράψουμε είναι το:

<?php get_header(); ?>

Η παραπάνω εντολή λέει στο WordPress να “φέρει” το αρχείο header.php. Μην ανχώνεστε θα το δημιουργήσουμε σε λίγο. Μετά θα γράψουμε το διάσημο Loop του WordPress, το οποίο θα μας εμφανίσει τα άρθρα μας άν αυτά υπάρχουν. Έτσι αμέσως μετά γράφουμε:

<div id="content">
<?php if (have_posts()) : ?>
<?php while (have_posts()) : the_post(); ?>
<div class="post"  id="post-<?php the_ID(); ?>">
<h2 class="title"><a href="<?php the_permalink() ?>" rel="bookmark" title="Σύνδεσμος στο <?php the_title_attribute(); ?>"><?php the_title(); ?></a></h2>
<p class="meta"><span class="date"><?php the_time('F jS, Y') ?></span><span class="posted">Από τον/την&nbsp;<?php the_author() ?></span></p>
<div>
<?php the_excerpt(); ?>
<p class="links">
<a href="<?php the_permalink() ?>" rel="bookmark" title="Σύνδεσμος στο <?php the_title(); ?>">Περισσότερα...</a>
<b>&nbsp;&nbsp;&nbsp;&nbsp;|&nbsp;&nbsp;&nbsp;&nbsp;</b>
<?php comments_popup_link('Κανένα σχόλιο', '1 Σχόλιο', '% Σχόλια', 'σχόλια'); ?>
</p>
</div>
</div>
<?php endwhile; ?>

O παραπάνω κώδικας κάνει τα εξής. Ελέγχει αν υπάρχουν άρθρα, και όσο υπάρχουν άρθρα μας τα εμφανίζει  (The Loop). Μετά εμφανίζει τις λεπτομέριες για τον συγγραφέα, την ώρα και την κατηγορία στην οποία ανήκει το άρθρο. Τέλος προσθέτουμε τους σύνδεσμους για την προβολή του άρθρου και τον αριθμό των σχόλιων που έχει.

Συνεχίζουμε προσθέτοντας τα παρακάτω:

<div class="navigation">
<div class="alignleft"><?php next_posts_link('&laquo; Παλαιότερα Άρθρα') ?></div>
<div class="alignright"><?php previous_posts_link('Νεότερα Άρθρα &raquo;') ?></div>
</div>
<?php else : ?>

Ας εξηγήσουμε λίγο τον κώδικα μας. Ο παραπάνω κώδικας, μας εμφανίζει το μενού που θα χρησιμοποιήσουμε για να περιηγηθούμε στα προηγούμενα και επόμενα άρθρα.

Αμεσώς μετά γράφουμε για να κλείσουμε το index.php τον εξής κώδικα:

<h2 class="center">Δεν βρέθηκε</h2>
<p class="center">Λυπούμαστε αλλά αυτό που ψάχνετε δεν βρέθηκε.</p>
<?php endif; ?>
</div>
<?php get_sidebar(); ?>
<?php get_footer(); ?>

Ο παραπάνω κώδικας, θα μας εμφανίσει το μήνυμα αυτό σε περίπτωση που δεν βρεθούν άρθρα. Επίσης κλείνουμε τις επαναλήψεις μας, και καλούμε τα αρχεία sidebar.php και footer.php.

Αφού τελειώσαμε με το index.php θα ανοίξουμε το style.css και θα δώσουμε τα στοιχεία του θέματος μας. Γράφουμε λοιπόν μέσα στο style.css τον εξής κώδικα:

/*
Theme Name: GreekTutsie
Theme URI: http://www.greektuts.net
Version: 1.0
Description: A theme created for the WordPress month in GreekTuts.net
Author: Pantso
Author URI: http://www.pantso.gr
*/

Αυτό ήταν. Το WordPress πλέον αναγνωρίζει ότι υπάρχει ένα θέμα με όνομα GreekTutsie. Βέβαια αν το εγκαταστήσετε τώρα δεν θα δείτε και πολλά αφού ακόμα μας λείπουν μερικά αρχεία για να ολοκληρώσουμε την αρχική μορφή της σελίδας μας. Έτσι λοιπόν δημιουργούμε 3 νέα αρχεία. Τα header.php, sidebar.php και footer.php. Όπως καταλαβαίνετε, αυτά τα αρχεία χειρίζονται τις αντιστοιχες με το όνομα τους, περιοχές της σελίδας μας.

Ανούγουμε το header.php και γράφουμε:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" <?php language_attributes(); ?>>
<head profile="http://gmpg.org/xfn/11">
<meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>" />
<title><?php bloginfo('name'); ?> <?php if ( is_single() ) { ?> &raquo; Blog Archive <?php } ?> <?php wp_title(); ?></title>
<meta name="generator" content="WordPress <?php bloginfo('version'); ?>" /><!-- leave this for stats -->
<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" media="screen" />
<link rel="alternate" type="application/rss+xml" title="<?php bloginfo('name'); ?> RSS Feed" href="<?php bloginfo('rss2_url'); ?>" />
<link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" />
<?php wp_head(); ?>
</head>
<body>
<div id="header">
<div id="logo">
<h1><a href="<?php echo get_option('home'); ?>/"><?php bloginfo('name'); ?></a></h1>
<p><?php bloginfo('description'); ?></p>
</div>
</div>
<!-- end header -->
<div id="menu">
<ul>
<liclass="current_page_item<?php if (is_home()) echo ' current_page_item'; ?>"><a href="<?php echo get_option('home'); ?>/" class="current_page_item">Homepage</a></li>
<?php wp_list_pages('title_li=' ); ?>
</ul>
</div>
<!-- end menu -->
<div id="wrapper">
<div id="page">
<div id="page-bgtop">

Ανοίγουμε το sidebar.php και γράφουμε τον κώδικα:

<div id="sidebar">
<ul>
<?php if (!function_exists('dynamic_sidebar') || !dynamic_sidebar()): ?>
<li>
<h2>Archives</h2>
<ul>
<?php wp_get_archives('type=monthly'); ?>
</ul>
</li>
<?php wp_list_categories('show_count=1&title_li=<h2>Κατηγορίες</h2>'); ?>
<?php wp_list_bookmarks(); ?>
<li>
<h2>Meta</h2>
<ul>
<?php wp_register(); ?>
<li><?php wp_loginout(); ?></li>
<li><a href="http://validator.w3.org/check/referer" title="This page validates as XHTML 1.0 Transitional">Valid <abbr title="eXtensible HyperText Markup Language">XHTML</abbr></a></li>
<li><a href="http://gmpg.org/xfn/"><abbr title="XHTML Friends Network">XFN</abbr></a></li>
<li><a href="http://wordpress.org/" title="Powered by WordPress, state-of-the-art semantic personal publishing platform.">WordPress</a></li>
<?php wp_meta(); ?>
</ul>
</li>
<?php endif; ?>
</ul>
</div>

Ανοίγουμε τέλος το footer.php και γράφουμε τον κώδικα:

<div style="clear: both; height: 20px;">&nbsp;</div>
</div></div>
<!-- end page -->
</div>
<div id="footer">
<div id="footer-wrap">
<p id="legal">Σχεδιασμός από τον <a href="http://www.pantso.gr/">Pantso</a> για το <a href="http://www.greektuts.net/">GreekTuts</a>. Με την δύναμη του <a href="http://wordpress.org/">WordPress</a>.<br /></p>
</div>
</div>
<?php wp_footer(); ?>
</body>
</html>

Τώρα οι αρχική σελίδα και οι βασικές λειτουργίες της ιστοσελίδας μας είναι ολοκληρωμένες. Προσπαθήστε να κάνετε εγκατάσταση του συγκεκριμένου θέματος ώστε να δείτε τι ακριβώς φτιάξαμε. Μπορείτε να κατεβάσετε τα αρχεία αυτού του βοηθήματος εδώ

Στο επόμενο βοήθημα της σειράς θα δημιουργήσουμε τα υπόλοιπα αρχεία του θέματος μας, και θα κάνουμε κάποιες οπτικές αλλαγές

Ας δούμε λοιπόν πόσο εύκολο είναι να εμφανίσουμε στην ιστοσελίδα μας τον αριθμό των ατόμων που μας κάνουν follow στο Twitter

Θα δημιουργήσουμε ένα νέο αρχείο με όνομα twitter.php και το τοποθετούμε μαζί με τα αρχεία του θέματος μας. Μέσα στο twitter.php γράφουμε τον κώδικα:

<?php
$tw = get_option("twitterfollowerscount");
if ($tw['lastcheck'] < ( mktime() – 3600 ) )
{
$xml=file_get_contents('http://twitter.com/users/show.xml?screen_name=greektuts');
if (preg_match('/followers_count>(.*)</',$xml,$match)!=0) {
$tw['count'] = $match[1];
}
$tw['lastcheck'] = mktime();
update_option("twitterfollowerscount",$tw);
}
echo $tw['count'];
?>

Αντικαθηστάτε την greektuts με το όνομα του λογαριασμού σας στο Twitter

Το μόνο που έχουμε να κάνουμε τώρα είναι να ανοίξουμε το index.php και στο σημείο που θέλουμε να εμφανίσουμε τον αριθμό στην σελίδα μας,να συμπεριλάβουμε την εντολή:

<?php include("twitter.php"); ?>

Ο παραπάνω κώδικας είναι γραμμένος από τον Rarst

Προβολή Twitt Me Κουμπιού με Αριθμό Τwitts

Αν θέλετε να εμφανίσετε ένα κουμπί (όπως αυτό που έχουμε εδώ στο GreekTuts), μέσω του οποίου ο αναγνώστης της σελίδας σας θα μπορεί να κάνει γρήγορο re-twitt του άρθρου σας, και το οποίο θα αναγράφει τον αριθμό των twitts για το συγκεκριμένο άρθρο, το μόνο που έχετε να κάνετε είναι να συμπεριλάβετε τον παρακάτω κώδικα στο θέμα σας (index.php , single.php) στο σημείο που θέλετε να το εμφανίσετε.

<script type="text/javascript">
tweetmeme_source = 'greektuts';
</script>
<script type="text/javascript"  src="http://tweetmeme.com/i/scripts/button.js"> </script>

Αλλάξτε την λέξη GreekTuts με το username σας στο Twitter. To κουμπί αυτό θα χρησιμοποιεί την υπηρεσία TweetMeMe.

Προβολή των Τελέυταίων Twitt μας

Αν θέλετε να εμφανίσετε τα τελευταία Twitt σας, το μόνο που έχετε να κάνετε είναι να γράψετε τον παρακάτω κώδικα μέσα στο θέμα σας (index.php, single.php ή sidebar.php), στο σημείο που θέλετε αυτά να εμφανίζονται.

<div>
<?php
function parse_cache_feed($usernames, $limit) {
	$username_for_feed = str_replace(" ", "+OR+from%3A", $usernames);
	$feed = "http://search.twitter.com/search.atom?q=from%3A" . $username_for_feed . "&rpp=" . $limit;
	$usernames_for_file = str_replace(" ", "-", $usernames);
	$cache_file = dirname(__FILE__).'/cache/' . $usernames_for_file . '-twitter-cache';
	$last = filemtime($cache_file);
	$now = time();
	$interval = 600; // ten minutes
	// check the cache file
	if ( !$last || (( $now - $last ) > $interval) ) {
		// cache file doesn't exist, or is old, so refresh it
		$cache_rss = file_get_contents($feed);
		if (!$cache_rss) {
			// we didn't get anything back from twitter
			echo "<!-- ERROR: Twitter feed was blank! Using cache file. -->";
		} else {
			// we got good results from twitter
			echo "<!-- SUCCESS: Twitter feed used to update cache file -->";
			$cache_static = fopen($cache_file, 'wb');
			fwrite($cache_static, serialize($cache_rss));
			fclose($cache_static);
		}
		// read from the cache file
		$rss = @unserialize(file_get_contents($cache_file));
	}
	else {
		// cache file is fresh enough, so read from it
		echo "<!-- SUCCESS: Cache file was recent enough to read from -->";
		$rss = @unserialize(file_get_contents($cache_file));
	}
	// clean up and output the twitter feed
	$feed = str_replace("&amp;", "&", $rss);
	$feed = str_replace("&lt;", "<", $feed);
	$feed = str_replace("&gt;", ">", $feed);
	$clean = explode("<entry>", $feed);
	$clean = str_replace("&quot;", "'", $clean);
	$clean = str_replace("&apos;", "'", $clean);
	$amount = count($clean) - 1;
	if ($amount) { // are there any tweets?
		for ($i = 1; $i <= $amount; $i++) {
			$entry_close = explode("</entry>", $clean[$i]);
			$clean_content_1 = explode("<content type=\"html\">", $entry_close[0]);
			$clean_content = explode("</content>", $clean_content_1[1]);
			$clean_name_2 = explode("<name>", $entry_close[0]);
			$clean_name_1 = explode("(", $clean_name_2[1]);
			$clean_name = explode(")</name>", $clean_name_1[1]);
			$clean_user = explode(" (", $clean_name_2[1]);
			$clean_lower_user = strtolower($clean_user[0]);
			$clean_uri_1 = explode("<uri>", $entry_close[0]);
			$clean_uri = explode("</uri>", $clean_uri_1[1]);
			$clean_time_1 = explode("<published>", $entry_close[0]);
			$clean_time = explode("</published>", $clean_time_1[1]);
			$unix_time = strtotime($clean_time[0]);
			?>
						<?php echo $clean_content[0]; ?>
							<?php echo $pretty_time; ?>
			<?php
		}
	} else { // if there aren't any tweets
		?>
					Something Must Have Gone Wrong...
		<?php
	}
}
?>
<?php
parse_cache_feed(greektuts, 1)
?>
</div>

Αλλάξτε την λέξη GreekTuts με το username σας στο Twitter. Ο παραπάνω κώδικας θα εμφανίσει το τελευταίο twitt μας. Αν θέλετε να αλλάξτετε τον αριθμό των twitts που θα εμφανίζονται, στην γραμμή parse_cache_feed(greektuts, 1) αλλάξτε τον αριθμό 1 σε ότι επιθυμείτε. Ο παραπάνω κώδικας γράφτηκε από το spookyismy.name.

Προβολή των Φίλων σαν Εικόνες

Για να εμφανίσουμε τις εικονίτσες των φίλων μας (followers) σε μια λίστα θα χρησιμοποιήσουμε το πρόσθετο Twitter Friends. Μέσω αυτού μπορούμε να δημιουργήσουμε έναν πολύ όμορφο χώρο στην πλαϊνή μπάρα της ιστοσελίδας μας, με τις εικόνες των φίλων μας όπως αυτές που βλέπουμε στο Twitter.

Προβολή Twitts των Φίλων μας

Για να εμφανίσουμε τις εικονίτσες των φίλων μας (followers) σε μια λίστα θα χρησιμοποιήσουμε το πρόσθετο Tweet Blender. Μέσω αυτού, μπορούμε να δημιουργήσουμε έναν χώρο με τα τελευταία twitts όλων των φίλων που μας ενδιαφέρουν. Περισσότερα στο control panel του plugin.

Τι Είναι Ένα Θέμα

Το θέμα στο WordPress είναι μια συλλογή από αρχεία PHP, CSS και εικόνες. Αυτά τα αρχεία, ελέγχουν τον τρόπο με τον οποίο θα εμφανίζεται η ιστοσελίδα μας και το περιεχόμενο της στον επισκέπτη.

Πως Λειτουργεί Ένα Θέμα

Το WordPress έχει μια συγκεκριμένη σειρά ελέγχων με την οποία λειτουργεί. Ας πάρουμε για παράδειγμα μια κεντρική σελίδα. Συνήθως αποτελείται από το header.php, το index.php, το sidebar.php και το footer.php. Μέσα σε κάθε από αυτά τα αρχεία, υπάρχει και ο αντίστοιχος κώδικας για να εμφανίστεί το περιεχόμενο της σελίδας μας σωστά. Το header.php αποτελείται από το DOCTYPE, τον τίτλο και τα διάφορα meta tags της σελίδας μας. Στο τέλος του αρχείου, καλούμε το index.php το οποίο αποτελείται από το περιεχόμενο της σελίδας μας. Στο τέλος του index.php καλούμε το sidebar.php όπου περιέχει τον κώδικα για την πλαϊνή μπάρα της σελίδας μας. Τέλος στο τέλος του sidebar.php καλούμε το footer.php που περιέχει τον κώδικα για το υποσέλιδο της σελίδας μας. Μπορεί να φαίνεται λίγο πολύπλοκο αλλά με μια καλύτερη ματιά παρακάτω θα δούμε πως δεν είναι.  Όπως καταλαβαίνετε λοιπόν, όλα τα αρχεία συνυπάρχουν. Καλούν το ένα το άλλο, ώστε να μπορέσουμε να παρουσιάσουμε πλήρως την σελίδα μας.

Σειρά Αρχείων

Το WordPress χρειάζεται οπωσδήποτε δυο αρχεία. Το index.php και το styles.css. Αυτά τα δυο αρχεία είναι αρκετά για να δείξουμε το περιεχόμενο μας, αλλά προφανώς δεν θα έχουμε και πολλές επιλογές χρησιμοποιόντας μόνο αυτά. Έτσι χρησιμοποιούμε και άλλα αρχεία όπως το sidebar.php το footer.php το comments.php και header.php. Όλα αυτά τα αρχεία επικοινωνούν μεταξύ τους καλόντας το ένα το άλλο. Η εντολές που χρησιμοποιούμε για να καλέσουμε τα διάφορα αυτά αρχεία είναι οι εξής:

<?php get_sidebar(); ?>
<?php get_header(); ?>
<?php get_footer(); ?>

Οι παραπάνω εντολές, όταν διαβαστούν από το WordPress, καλούν αυτόματα το αντίστοιχο αρχείο.

Ιεραρχία Ενός Θέματος

Ας δούμε λοιπόν ποιά είναι η ιεραρχία των αρχείων ενός θέματος και η σειρά λειτουργίας.

Κάντε κλικ στην εικόνα για μεγέθυνση

Περιεχόμενα

Ας δούμε λοιπόν επιλεκτικά τι περιέχουν τα βασικά αρχεία μιας σελίδας και πως συνδέονται μεταξύ τους (πως καλεί το ένα το άλλο).

Styles.css

Το styles.css είναι το αρχείο που περιέχει όλα τα CSS, δηλαδή ελέγχει τον τρόπο με τον οποίο θα εμφανίζεται το θέμα μας. Το αρχείο αυτό ξεκινάει με τον εξής κώδικα

/*
Theme Name: Theme Name
Theme URI: http://your-website.com/cool-theme/
Description: Totally awesome WordPress theme by
<a href="http://your-website.com/">Yours Truly</a>
Version: 1 (WP2.8.4)
Author: Your Name
Author URI: http://your-website.com/
Tags: super, awesome, cool, sweet, potato nuggets
*/

Ο παραπάνω κώδικας, δίνει πληροφορίες για το θέμα όπως το όνομα του, τον δημιουργό του, την έκδοσή του, και τα διάφορα tags που θέλουμε. Μετά από αυτό ακολουθεί κανονικά ο CSS κώδικας

Header.php

Το Header.php είναι ουσιαστικά η αρχή της σελίδας μας. Περιέχει το DOCTYPE, τον τίτλο της σελίδας και τα metatags. Επίσης εδώ είναι που θα κάνουμε include τα styles.css και την jQuery. Ακολουθούν κάποια από τα περιεχόμενα του header.php.

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN”
“http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=UTF-8” />
<title>The Title</title>
<link href=”style.css” rel=”stylesheet” type=”text/css” />
<link rel=”shortcut icon” href=”images/favicon.ico” />
</head>

Index.php

To index.php είναι το βασικότερο αρχείο στο θέμα μας. Περιέχει όλο τον κώδικα για το περιεχόμενο μας. Εδώ περιέχεται και ο διάσιμος κώδικας The Loop. Συνήθως σε αυτό θα βρείτε τα εξής

<?php get_header(); ?>
<?php
// The Loop
if (have_posts()) : while (have_posts()) : the_post();
...
endwhile; else:
...
endif;
?>
<?php get_sidebar(); ?>
<?php get_footer(); ?>

Εδώ τελειώνουμε το σημερινό μας βοήθημα. Στο επόμενο μέρος θα ξεκινήσουμε την ανάπτυξη του δικού μας θέματος από την αρχή

Αυτόματη Εγκατάσταση

Πρώτα από όλα θα πρέπει να συνδεθούμε στο Control Panel της ιστοσελίδας μας. Αυτό βρίσκεται στο http://ηιστοσελίδαμου.gr/wp-admin

Μετά την είσοδό μας, θα επιλέξουμε το Appearance (Εμφάνιση) από την μπάρα πλοήγησης στα αριστερά

Έτσι θα βρεθούμε στον κατάλογο με τα εγκατεστημένα θέματα. Το WordPress έρχεται με δυο προεγκατεστημένα θέματα. Επόμενο βήμα είναι είτε να επιλέξουμε το Add New Themes(Προσθήκη Νέου) από την μπάρα πλοήγησης, ή να πατήσουμε το κουμπί Add New που βρίσκεται δίπλα από τον τίτλο Manage Themes.

Από εδώ μπορούμε να ψάξουμε για δωρεάν θέματα, ανάλογα με τις απαιτήσεις μας. Μπορούμε να φιλτράρουμε κατά χρώμα, κατά μορφοποίηση (αριθμός στηλών), κατά χαρακτηριστικά, και κατά θέμα. Μπορούμε επίσης να ψάξουμε για θέματα χρησιμοποιόντας λέξεις κλειδιά. Σε αυτόν τον οδηγό θα ψάξουμε για ένα μαύρο θέμα. Αυτό το κάνουμε επιλέγοντας το κουτάκι Black από το Colors, και πατώντας Find Theme(Εύρεση)

Αμέσως το WordPress μας επιστρέφει μια λίστα με όλα τα θέματα που έχουν την λέξη black στα tags τους, ή ανήκουν σε αυτήν την κατηγορία. Εδώ μας επιτρέπονται δυο επιλογές. Μπορούμε να κάνουμε προεπισκόπηση του θέματος ( πατώντας το Preview ) και να κάνουμε άμεση εγκατάσταση ( πατώντας το Install ).

Κάνοντας Preview, το WordPress μας ανοίγει ένα νέο αναδυόμενο παράθυρο, στο οποίο εφαρμόζει το θέμα που θέλουμε να δούμε στην ιστοσελίδα μας.

Πατώντας Install το WordPress μας ανοίγει ένα αναδυόμενο παράθυρο με τις λεπτομέριες του θέματος και το κουμπάκι Install Now. Για να κάνουμε την αυτόματη εγκατάσταση, πατάμε σε αυτό το κουμπί

Αμέσως το WordPress μας εμφανίζει τα στοιχεία του θέματος, την πρόοδο της εγκατάσταση και το αποτέλεσμα. Επίσης μας δίνει την δυνατότητα να το ενεργοποιήσουμε.

Επιστρέφοντας στο μενού Appearance>Themes (Εμφάνιση>Θέματα) μπρούμε πλέον να δούμε στην λίστα και το θέμα που μόλις εγκαταστήσαμε. Το μόνο που μένει τώρα είναι να το ενεργοποιήσουμε πατώντας το Activate (Ενεργοποιήση).

Ας δούμε λοιπόν και την τελευταία επιλογή που έχουμε στο μενού Apprearance. Αυτή είναι ο Editor.

Μέσα από τον editor μας δίνεται η δυνατότητα να επεξεργαστούμε και να παρέμβουμε στο θέμα μας. Από την λίστα των αρχείων που θα βρούμε στο αριστερό μέρος (εικόνα παρακάτω), μπορούμε να αλλάξουμε τον κώδικα σε όποιο από τα αρχεία του θέματος μας θέλουμε.

Χειροκίνητη Εγκατάσταση

Η χειροκίνητη εγκατάσταση απαιτεί να έχουμε πρόσβαση στα αρχεία και τους φακέλους της ιστοσελίδας μας (FTP πρόσβαση). Αφού συνδεθούμε μέσω ενός FTP client (όπως ο FileZilla) στην ιστοσελίδα μας, θα πρέπει να μπούμε στον φάκελο wp-content. Εκεί θα βρούμε έναν φάκελο με το όνομα themes. Μέσα σε αυτόν τον φάκελο βρίσκονται όλα τα εγκατεστημένα θέματα της ιστοσελίδας μας.

Έχοντας λοιπόν το θέμα μας, θα πρέπει να το μεταφέρουμε σε αυτόν τον φάκελο. Μετά το μόνο που μένει είναι να το ενεργοποιήσουμε με τον ίδιο τρόπο που είδαμε παραπάνω

Προσοχή: Το κάθε θέμα έχει τον δικό του φάκελο

Που μπορώ να βρώ θέματα

Υπάρχουν δωρεάν αλλά και επί πληρωμή θέματα. Ακολουθούν μερικοί σύνδεσμοι τόσο για δωρεάν όσο και για επί πληρωμή θέματα στο διαδίκτυο

Δωρεάν Θέματα

Επίσημος Κατάλογος Θεμάτων

Top WordPress Themes

Ελληνικά WordPress Themes

Natty WP

Theme Spot

Premium Θέματα

Themeforest.net

Elegant Themes

Woo Themes

Μεγάλος Διαγωνισμός

Μην ξεχνάτε τον μεγάλο διαγωνισμό που τρέχει για τον Μήνα WordPress. Λάβετε και εσείς μέρος στον διαγωνισμό και αδράξετε την ευκαιρία να γίνετε ένας από τους 22 τυχερούς που θα κερδίσουν πλούσια δώρα. Διαβάστε τις οδηγίες και τους όρους συμμετοχής , και μπείτε και εσείς στην κλήρωση. Περισσότερα εδώ

Μέσω Fantastico

Το Fantastico προσφέρεται στους χρήστες που έχουν cPanel ως μέσω διαχείρησης του “πίσω” μέρους της ιστοσελίδας τους. Μέσα από την εγκατάσταση με αυτόν το τρόπο ο χρήστης μπορεί χωρίς ιδιαίτερες γνώσεις να εγκαταστήσει το WordPress στον server του γρήγορά και απλά.

Για να μπείτε στις ρυθμίσεις του Fantastico θα πρέπει να πατήσετε στο κουμπάκι που απεικονίζεται στην εικόνα παρακάτω

Επιλέγοντας το Fantastico, μας εμφανίζεται μια λίστα με όλες τις εφαρμογές που μπορούμε να εγκαταστήσουμε. Επιλέγοντας το WordPress από την λίστα φτάνουμε στις παρακάτω επιλογές.

Επιλέγουμε το New Isntallation

και μας εμφανίζονται οι επιλογές εγκατάστασης

Εδώ θα βάλουμε τα στοιχεία εγκατάστασης. Επιλέγουμε το όνομα του φακέλου που θέλουμε να εγκαταστήσουμε το WordPress, ή αφήνουμε το πεδίο κενό για να εκγαταστήσουμε στο κεντρικό φάκελο. Επιλέγουμε επίσης τα Username και Password για τον administrator χρήστη. Τέλος επιλέγουμε το nickname, το email, το όνομα του blog μας και την περιγραφή. Μόλιες έχουμε κάνει όλες τις επιλογές που θέλουμε, πατάμε στο Install WordPress. Αυτό μας εμφανίζει τα παρακάτω

Εδώ μας δίνονται οι τελικές πληροφορίες. Αν όλα είναι σωστά, πατάμε το Finish Installation. Αυτο μας εμφανίζει

Εδώ μας δίνονται τα στοιχεία την εγκατάστασης, καθώς και οι σύνδεσμοι πρόσβασης στο blog αλλά και στην περιοχή διαχείρησης. Ακολλουθόντας τον σύνδεσμο, φτάνουμε στο μέρος διαχείρησης του WordPress όπου και κάνουμε login με τα στοιχεία που δώσαμε παραπάνω

Αυτό ήταν. Με έυκολα και απλά βήματα, χωρίς να χρειάζεται να γνωρίζουμε πολλά, εγκαταστήσαμε το WordPress στον server μας. Ας δούμε τώρα τον πίο δύκολο αλλά πιο ελεγχόμενο τρόπο εγκατάστασης.

“Χειροκίνητη” Εγκατάσταση

Για περισσότερο έλεγχο κατά την εγκατάσταση του WordPress, επιλέγουμε τον χειροκίνητο τρόπο. Αυτό σημαίνει πως έχουμε πρόσβαση στον server μας μέσω FTP.

Θα πρέπει πρώτα από όλα να δημιουργήσουμε μια βάση δεδομένων για την ιστοσελίδα μας. Αυτό το κάνουμε ανοίγοντας το control panel της ιστοσελίδας μας και εντοπίζοντας το phpmyadmin. Αυτό θα μας πάει στο κέντρο ελέγχου της MySql. Από εδώ μπορούμε να κάνουμε όλες τις ρυθμίσεις για τις βάσεις δεδομένων μας. Στο πεδίο Create new database θα προσθέσουμε το όνομα της βάσης μας και θα πατήσουμε create

Τώρα χρειάζεται να προσθέσουμε και έναν χρήστη στην βάση μας. Αυτό το κάνουμε πηγαίνοντας στην καρτέλα Privillages και πατόντας Add new user.

Σε αυτήν την φόρμα θα προσθέσουμε τα στοιχεία που θέλουμε. Το username, το password, και θα επιλέξουμε το Check All, ώστε να δώσουμε πλήρη δικαιώματα στην χρήστη. Τέλος πατάμε το Go που βρίσκεται κάτω δεξιά.

Έτσι λοιπόν έχουμε την βάση μας και τον χρήστη. Ας προχωρήσουμε στην εγκατάσταση.

Επόμενο βήμα είναι να κατεβάσουμε το WordPress από εδώ και κάνουμε αποσιμπίεση του αρχείου. Μετά την αποσυμπίεση θα έχουμε έναν φάκελο με το όνομα wordpress. Ο φάκελος αυτός περιέχει όλα τα αρχεία του WordPress.

Επόμενο βήμα είναι να αποκτίσουμε πρόσβαση στα αρχεία του server μας. Αυτό το αποκαλούμε FTP access. Λογικά τα στοιχεία για τον FTP λογαριασμό σας τα έχετε κάπου μαζί με τα στοιχεία του server σας. Έτσι επιλέγοντας ένα FTP Client (όπως το FileZilla) κάνουμε login στον server μας με τα στοιχεία μας.

Αφού λοιπόν έχουμε το αγαπημένο μας FTP Client ανοιχτό και έχουμε συνδεθεί με επιτυχία στον server μας, πάμε στον κεντρικό φάκελο. Αυτός συνήθως έχει το όνομα www ή httpdocs. Εδώ είναι που θα κάνουμε drag n drop τα αρχεία που βρίσκονται στον φάκελο wordpress που κάναμε unzip/unrar προηγουμένως.

Μόλις τελειώσει το upload, το μόνο που έχουμε να κάνουμε είναι να επισκεφτούμε το

http://ηιστοσελίδασας.gr/wp-admin/install.php

Εδώ το πρώτο πράγμα που θα δούμε είναι ένα αυτοματοποιημένο μήνυμα από το WordPress που μας ενημερώνει ότι δεν έχει δημιουργηθεί το configuration file.

Μην πανικοβάλεστε. Πατήστε απλά Create a configuration file .

Στο επόμενο βήμα πατάμε Let’s Go!

Εδώ θα βάλουμε τα στοιχεία της βάσης δεδομένων που δημιουργήσαμε νωρίτερα και θα πατήσουμε Submit και Run the Install

Θα δώσουμε τίτλο στην σελίδα μας και θα προσθέσουμε και το email μας και θα πατήσουμε Ιnstall WordPress

Μόλις τελειώσει η εγκατάσταση, το WordPress θα μας επιστρέψει το username και το password μας. Καλό είναι το password να το αποθηκεύσουμε κάπου, αφού θα το χρειαστούμε τουλάχιστον μια φορά για να εισέλθουμε στην σελίδα διαχείρησης. Πατώντας Log In θα βρεθούμε στην σελίδα εισόδου για την περιοχή διαχείρησης του ιστότοπου μας.

Το πρώτο πράγμα που προτείνεται να κάνετε είναι να αλλάξετε τον αυτόματο κωδικό πρόσβασης που σας έδωσε το WordPress.

Έτσι πατώντας στο Yes, Take me to my profile page θα οδηγηθείτε στην σελίδα του προφίλ σας, όπου μπορείτε να κάνετε αλλαγές στο password και στα στοιχεία σας.

Επισκόπηση

Πρίν κλείσουμε θα κάνουμε μια πολύ γρήγορη περιήγηση στις επιλογές του WordPress

Ας ρίξουμε μια γρήγορη ματιά στο μενού του WordPress που βρίσκουμε στα αριστερά

• Posts : Από εδώ μπορούμε να διαχειριστούμε όλα τα άρθρα μας. Να γράψουμε νέα, να κάνουμε επεξεργασία παλαιότερων άρθρων, να δούμε και να επεξεργαστούμε τα tags των άρθρων μας και να δούμε και να επεξεργαστούμε τις κατηγορίες των άρθρων μας.
• Media : Από εδώ μπορούμε να διαχειριστούμε τις εικόνες, τα βιντεο και τα αρχεία που ανεβάζουμε στο WordPress.
• Links : Από εδώ μπορούμε να διαχειριστούμε τους συνδέσμους και τις κατηγορίες συνδέσμων της ιστοσελίδας μας (το γνωστό blogroll).
• Pages : Από εδώ μπορούμε να διαχειριστούμε τις στατικές σελίδες της ιστοσελίδας μας. Να δημιουργήσουμε νέες σελίδες και να επεξεργαστούμε ήδη υπάρχουσες.
• Comments : Από εδώ μπορούμε να διαχειριστούμε τα διάφορα σχόλια που αφήνουν οι χρήστες στην ιστοσελίδα μας.
• Appearance : Από εδώ μπορούμε να ελένξουμε της εμφάνιση της ιστοσελίδας μας προς τον χρήστη.
• Plugins : Από εδώ μπορούμε να διαχειριστούμε και να εγκαταστήσουμε plugins.
• Users : Εδώ μπρούμε να διαχειρηστούμε τους εγγεγραμένους χρήστες μας.
• Tools : Εδώ το WordPress μας δίνει την δυνατότητα να κάνουμε εισαγωγή και εξαγωγή αρχείων (import-export).
• Settings : Τέλος εδώ μπρούμε να διαχειριστούμε όλες τις ρυθμίσεις συμπεριφοράς του WordPress.

Πριν κάνετε οποιεσδήποτε αλλαγές σιγουρευτείτε ότι έχετε αποθηκευμένα πρόσφατα αντίγραφα ασφάλειας.

Αντιγράψτε το αρχείο sidebar.php του θέματός σας και αποθηκεύστε το με διαφορετικό όνομα, π.χ. sidebar-post.php και κάντε αλλαγές που θέλετε. Ανοίξτε το αρχείο single.php και βρείτε την συνάρτηση

get_sidebar();

Αντικαταστήστε την με τον παρακάτω κώδικα

$sidebar = get_post_meta($post->ID, "sidebar", true);
get_sidebar($sidebar);

Στα άρθρα όπου θέλετε να εμφανίζετε το sidebar-post δημιουργήστε νέο προσαρμοσμένο πεδίο με το όνομα sidebar και την τιμή post

Αν δεν θα προσθέσετε αυτό το προσαρμοσμένο πεδίο θα εμφανίζεται το βασικό sidebar.
Το ίδιο μπορείτε να κάνετε και με τις σελίδες, αλλάζοντας το αρχείο page.php.

Αν θέλετε ίδιο sidebar για όλα τα άρθρα (στο παράδειγμά μας sidebar-post) τότε στο αρχείο single.php πρέπει να αντικαταστήσετε την συνάρτηση

get_sidebar();

με τον παρακάτω κώδικα

 include (“sidebar-post.php”);

Το ίδιο μπορείτε να κάνετε και με τις σελίδες και με τα αρχεία, αλλάζοντας page.php και archive.php.
Ας δούμε πως μπορούμε να κάνουμε αυτά τα sidebars widget-ready,δλδ για να προσθέτουμε εύκολα κάποιες πληροφορίες στο πλευρικό πάνελ χωρίς την επεξεργασία του κώδικα.

Widgets είναι μονάδες που μπορείτε να προσθέσετε στο πλευρικό πάνελ του blog σας με τον Drag and Drop τρόπο. Είναι πολύ εύκολα στην χρήση. Υπάρχουν άπειρα widgets που μπορείτε να κατεβάσετε από την επίσημη σελίδα του wordpress (http://wordpress.org/extend/plugins/tags/widget).

Ανοίξτε το αρχείο functions.php του θέματος σας και βρείτε τον κώδικα παρόμοιο με αυτόν

if ( function_exists('register_sidebar') )
register_sidebar(array(
'name' => 'Sidebar',
'before_title' => '
',
'after_title' => '
',
'before_widget' => '
',
'after_widget' => '
',
));

Αντιγράψτε τον (εκτός πρώτης γραμμής) και επικολλήστε αμέσως μετά αλλάζοντας μόνο το όνομα ‘name’=>,στο παράδειγμά μας sidebar-post

if ( function_exists('register_sidebar') )
register_sidebar(array(
'name' => 'Sidebar',
'before_title' => '
',
'after_title' => '
',
'before_widget' => '
',
'after_widget' => '
',
));
register_sidebar(array(
'name' => 'Sidebar-post',
'before_title' => '
',
'after_title' => '
',
'before_widget' => '
',
'after_widget' => '
',
));

Πατήστε ‘Ενημέρωση αρχείου’. Πηγαίνετε στο μενού ‘Εμφάνιση-Μονάδες’ και δείτε το αποτέλεσμα.

Ανοίξτε το αρχείο sidebar-post που δημιουργήσατε στην αρχή, βρείτε τον κώδικά

php if ( !function_exists('dynamic_sidebar')|| !dynamic_sidebar(1) )

Και αλλάξτε τον αριθμό (1) με το (2),δλδ με τον αριθμό της σειράς που έχει στο αρχείο functions.php

php if ( !function_exists('dynamic_sidebar')|| !dynamic_sidebar(2) )

Με αυτόν τον τρόπο μπορείτε να προσθέσετε και άλλα widget-ready sidebars.