inBlog.gr – Webmaster, SEO & Internet marketing Blog

Tutorials back to homepage

Οι επεκτάσεις και προσθήκες στο WordPress ονομάζονται plugins. Αυτή την στιγμή στην ιστοσελίδα του WordPress υπάρχουν περισσότερα από 11000 plugins, τα οποία κάνουν οτιδήποτε μπορούμε να φανταστούμε. Η δύναμη του WordPress βρίσκεται σε αυτές τις χιλιάδες προσθήκες που σας δίνουν τη δυνατότητα να προσθέσετε ασφάλεια, ταχύτητα, να δείτε τα στατιστικά σας, να κάνετε βελτιστοποίηση για τις μηχανές αναζήτησης ακόμη και να προσθέσετε διαφημίσεις στην ιστοσελίδα σας.

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

1. Το Google XML Sitemaps δημιουργεί ένα ειδικό sitemap XML που ενημερώνει τις μηχανές αναζήτησης Google, Bing, Yahoo, κάθε φορά που γράφετε ένα νέο άρθρο.

2. Το All in One SEO Pack βελτιστοποιεί τα κείμενα σας για τις μηχανές αναζήτησης. Το SEO είναι σημαντικό για να μπορεί η ιστοσελίδα σας να εμφανίζεται όσο το δυνατόν πιο υψηλά στα αποτελέσματα των μηχανών.

3. Το Contact Form 7 δημιουργεί μια φόρμα επικοινωνίας την οποία μπορείτε να επεξεργαστείτε και προσαρμόσετε στης δικές σας ανάγκες. Η φόρμα επικοινωνίας υποστηρίζει Ajax-powered submitting, CAPTCHA, Akismet spam filtering και ούτω καθεξής.

4. Το NextGEN Gallery είναι το καλύτερο Image Gallery για το WordPress.

5. Το WP Super Cache κάνει δυο δουλειές ταυτόχρονα. Πρώτον βοηθά της σελίδες σας να φορτώνουν γρηγορότερα, και δεύτερον δημιουργεί στατική εκδοχή του όλου σαιτ, γεγονός που μειώνει τις απαιτήσεις του CPU όταν χρησιμοποιείτε το WordPress.

6. Με το All in One Adsense and YPN αυτόματα εισάγουμε διαφημίσεις της google adsense ή της yahoo publisher network (YPN).

Το άρθρο γράφθηκε για το inBlog.gr απο τον Πάνο Κοντογίαννη, εναν άνθρωπο με πάθος στο τομέα του web development και του SEO

Πως να ετοιμάσετε ένα σωστο design+illustration portfolio(0)

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

Παρουσιάστε μόνο τις καλύτερες δημιουργίες σας.
Μπορεί να έχετε εργαστεί σε πολλά projects και λόγω απαίτησεις του πελάτη να φτιάξατε κάποια πράγματα για τα οποία δεν είστε τόσοι περήφανοι..αυτό δε σημαίνει οτι είναι απαραίτητο και να τα προβάλλετε!
Επιλέξτε να δείξετε 3 καταπλητκικές δημιουργίες σας παρά 14 μέτριες.

Γνώρισε τις δυνατότητες σου και συγκεντρώσου σε αυτές!
Μπορεί να φαίνεται εκ πρώτης όψεως πιο αποδοτικό να μπορεί κάποιος να προσφέρει όλων των ειδών της design υπηρεσίες αλλά εάν έχει έφεση λ.χ. στη σχεδίαση λογοτύπων τότε ας ασχοληθεί αποκλειστικά με αυτό το τομέα! Εξάλλου, δεν είναι εύκολο να γίνεις expert σε ένα τομέα και σίγουρα θα σε προτιμήσουν σε σχέση με αντα-γωνιστές σου που κάνουν τα πάντα άλλα όπως να΄ναι..

Συμπεριλάβετε μόνο τις δουλειές που σου αρέσουν.
Όπως και με το παραπάνω, εαν κάποιος δεν έχει έφεση στο banner design ή δεν του αρέσει για τον χ,ψ λόγο δεν θα πρέπει να το συμπεριλάβει στο portfolio του καθώς να’στε σίγουροι θα βρεθεί κάποιος να σας προσλάβει για τέτοια δουλειά που δεν σας αρέσει..

Οργανώστε σωστά το portfolio σας!
Δημιουργήστε ξεχωριστές κατηγορίες(ή και σελίδες) όπου θα έχετε συγκεντρωμένα στην πρώτη λ.χ. τα logo που έχετε σχεδιάσει, σε μια άλλη κατηγορία τα banner designs κ.ο.κ.

Κρατήστε το απλό και συνεχίστε να το ανανεώνετε
Μη ψάχνετε το portfolio σας να είναι κατι φαντεζί..προσπαθείστε να το κρατήσετε όσο δυνατόν πιο απλό και φιλικο-προς-το-χρήστη. Στα δείγματα εργασίας να έχετε πάντα εικόνες υψηλής ανάλυσης χωρίς pixelations κ.α. Επίσης πρέπει να προσθέτετε(εφ’όσον υπάρχουν) ανα τακτά διαστήματα τις νέες δουλειές σας και προσπαθήστε να προβάλλετε τη γενικότερη δραστηριότητα σας!

Κάτι άλλο που θα θέλατε να προσθέσετε; Ας ακούσουμε μερικές γνώμες!

Το παρών άρθρο πρωτοδημοσιέυθηκε στο http://w24.gr/ – ελληνικό webmaster + SEO forum. Εγγραφείτε στο φόρουμ για να αφήσετε τη γνώμη σας και να συζητήσετε το θέμα με άλλους χρήστες.
ΠΗΓΗ: http://www.w24.gr/viewtopic.php?f=24&t=157

WordPress Tutorial – Πως να φτιάξεις το δικό σου wordpress theme!(14)

Σε αυτό το βοήθημα ( βοήθημα; ) θα προσπαθήσω να καλύψω το μεγαλύτερο μέρος, όσο αναφορά τη δημιουργία ενός Template από το μηδέν. Παρόλα αυτά, δεν θα ασχοληθώ καθόλου με το Slicing ενός template και τη συγγραφή του CSS / XHTML, αλλά με τη δομή, τις loops και το πόσο καλύτερο μπορεί να γίνει ένα Template με τη χρήση αρκετών Tips and Tricks!

Let’s talk about Themes
Τα Themes του WordPress είναι κατά την ταπεινή γνώμη, αρκετών Designers ότι ποίο εύκολο ως προς επεξεργασία αλλά και δημιουργία ενός Template.

Ο λόγος είναι απλώς. Το template system του WordPress, λειτουργεί με απλά php template tags τα οποία προσθέτονται εύκολα στο Header, το content Area, το Sidebar (εάν το χρειαζόμαστε) και το Footer μας.

Ας το δούμε πάνω σε μια εικόνα, για να γίνει λίγο ποίο κατανοητό
Στην παραπάνω εικόνα λοιπόν έχουμε, στο ένα (1) Header της σελίδας μας
στο δεύτερο (2) κομμάτι, την sidebar στην οποία έχουμε περάσει το menu μας , στο τρίτο (3) έχουμε το περιεχόμενο μας, το content area και στο τελευταίο κομμάτι το τέταρτο (4) έχουμε το Footer μας.

Αν δούμε το αρχείο μας από άποψη κώδικα, έχουμε ένα index.php αρχείο, μέσα στο οποίο έχουμε, στην αρχή την κλήση του Header, μετά την κλίση του sidebar της σελίδας μας, το content area στο οποίο, προσθέτουμε την WordPress Loop, η οποία καλεί τα κείμενά μας, είτε αυτά είναι Blog posts είτε Pages. Στο τέλος του αρχείου υπάρχει η κλήση προς το footer.php

Ακριβώς με τον ίδιο τρόπο, δεν σχεδιάζετε και την σελίδα σας για τη χρήση με απλή XHTML, ακολουθώντας τα Web Standards, και έχοντας μια σωστή δομή;
Φυσικά, καμία από αυτές τις περιοχές δεν είναι υποχρεωτική για τη σωστή λειτουργεία του Template.

Ας προχωρήσουμε λίγο παρακάτω…

Theme FrameWorks
Ίσως όταν σχεδιάζετε, να έχετε δεί τη χρήση κάποιων Frameworks. Τέτοια είναι για παράδειγμα το 960gs το οποίο αυτό που κάνει είναι να μας δίνει ένα αρχείο με έτοιμες κάποιες κάθετες γραμμές, τις οποίες εάν τις ακολουθήσετε στα μεγέθη του, θα μπορέσετε να έχετε έτοιμο το CSS το οποίο χρειάζεστε μετά για να τοποθετήσετε το photoshop mockup σας, μέσα στη σελίδα.

Τα ίδια ακριβώς framework μπορείτε να χρησιμοποιήσετε μέσα στη σελίδα σας. Παρόλα αυτά όμως, για να γίνει ακόμη ποίο εύκολη η ζωή των front end designers του WordPress, υπάρχεου και WordPress Theme Frameworks. Αυτά, έχουν έτοιμα όλα τα αρχεία τα οποία χρεάζεστε για τη δημιουργία ενός WordPress Theme το οποίο θα παίζει χωρίς να χρειαστεί να γράψετε εσείς κώδικα! Απλώς θα δημιουργήσετε το δικό σας child theme με απλά CSS αρχεία.

Child Themes; Τι είναι αυτά;
Τα frameworks όπως είναι φυσικό, θέλουν να κρατιούνται ανανεωμένα σε όλα τα νέα χαρακτηριστικά που προσθέτονται στο WordPress. Έτσι, αντί να επεξεργάζεστε το styles.css το βασικό αρχείο επεξεργασίας των θεμάτων, σας δίνουν τη δυνατότητα να έχετε ένα έξτρα αρχείο CSS, μέσα στο οποίο μπορείτε να προσθέσετε το CSS κώδικα σας που αντιστοιχεί σε συγκεκριμένα elements του design και διαβάζετε πριν από το style.css.
Αρκετές φορές παρόλα αυτά και για designs τα οποία ξεφεύγουν από την δομή που μπορεί να έχει το framework, χρειάζεται να ασχοληθείτε και με τα βασικά αρχεία το framework. Δυστυχώς οι αλλαγές που μπορούν να γίνουν με τα περισσότερα από αυτά αυτόματα, δεν είναι τόσο flexible.

flexible, τί είναι αυτό;
Τα theme frameworks έρχονται με ένα Option page, μέσα από το οποίο μπορείτε να επεξεργαστείτε τις ρυθμίσεις αλλά και την εμφάνιση του Theme σας. Παραδείγματα είναι η μεριά του sidebar ( αριστερά η δεξιά) να είναι η όχι Fluid το design, να είναι fluid το header ή το footer, Search Engine Options και πολλά ακόμη.
Και δεν γράφω php κώδικα;
Τα theme frameworks, δίνουν μια έξτα βοήθεια για αυτούς που θέλουν να γράψουν και κώδικα. Περιέχουν ειδικές Hooks μέσα στα Template τους, και έτσι όταν θέλετε να εμφανίσετε κάτι μέσα στο template, σε ένα συγκεκριμένο σημείο το μόνο που έχετε να κάνετε είναι να προσθέσετε μια πολύ μικρή function, μέσα στο αρχείο functions.php η οποία θα εκτυπώνει μέσα στο hook που επιθυμείτε.

Έχεις να προτείνεις κάποια framework;
Φυσικά. Μπορείτε να ρίξετε μια ματιά στα παρακάτω

HeadWay framework
Ένα από τα αγαπημένα μου και η χρήση του κάθε φορά με εντυπωσιάζει. Εάν δείτε τα demo videos το όλο design μπορείτε να το καθορίσετε πολύ εύκολα με drag n drop επιλογές. Μπορείτε να δείτε μερικά ενδιαφέροντα tutorials εδώ http://headwayhq.com/

Thesis
Αν και η έκδοση 1.6 που είναι τώρα είναι ακρετά δυνατή για εμένα προσωπικά, χρειάζεται αρκετές βελτιώσεις. Παρόλα αυτά είναι σίγουρα ένα υπέροχο εργαλείο για κάποιους ποιο εξιδικευμένους με το CSS και την php (φυσικά και με το WordPress)http://diythemes.com/thesis/

Hybrid
και αυτό ένα από τα αγαπημένα. Το documentation και το support του είναι αυτά που θα σας εντυπωσιάσουν και θα σας κάνουν να το αγαπήσετε. Για τους λάτρεις του web typography, είναι σίγουρα το ποίο αγαπημένο framework! http://themehybrid.com/themes/hybrid

Ithemes builder και Elastic
Αυτά τα theme frameworks θεωρώ πως είναι το μέλον. Αυτό που κάνουν είναι να προσθέτουν την μεγαλύτερη διαθέσιμη ευκολία μέσα στα Options του Theme από το Admin Panel. Μάλιστα με τη χρήση τους μπορείτε να φέρετε ένα design σε αποτελέσματά που δεν θα πιστέψετε, απλώς ορίζοντας μεγέθη και μεταβλητές μέσα από το options page!
http://ithemes.com/purchase/builder-theme/
http://wordpress.org/extend/plugins/elastic-theme-editor/

Υπάρχουν και άλλα;
Πολλά αλλά δεν έχω μείνει ευχαριστημένος. Αυτό είναι αντικειμενική άποψη παρόλα αυτά, μπορείτε να τα δοκιμάσετε και να μας πείτε και εμάς τη γνώμη σας!

Αυτά ήταν;
Όχι. Έχουμε και κάτι τελευταίο. Το Artisteer. Ένα μοναδικό εργαλείο το οποίο θα λατρέψετε αν αρχίσετε να το χρησιμοποιείτε!

Το Artisteer είναι ένας WYSIWYG editor ο οποίος σας επιτρέπει να κάνετε Export σε WordPress, Joomla, Drupal και απλή XHTML / CSS. Ο κώδικας που βγάζει είναι 100% Valid αν και δεν χρησιμοποιεί καθόλου CSS3. Η επεξεργασία και μετατροπή του theme γίνετε εύκολα αφού τα Classes που χρησιμοποιεί είναι είναι αρκετά απλά! Εάν το μάθετε αρκετά καλά, σύντομα θα μπορείτε να σχεδιάσετε τον βασικό ( ίσως και ολόκληρο το psd ) μέσα του και με πολύ λίγα βήματα να έχετε το design σας έτοιμο! http://www.artisteer.com/

Ας προχωρήσουμε λίγο στο Template μας τώρα

Η αρχιτεκτονική δομή που ακολουθεί το WordPress στα template files του είναι η παρακάτω:

Όπως βλέπετε, εάν δεν βρεί ένα από αυτά τα αρχείο, προχωράει παρακάτω μέχρι να βρεί ένα από αυτά, κατάλληλο για να παρουσιάσει το αποτέλεσμα που ζητήθηκε! Πότε όμως καλείτε κάθε από αυτά τα αρχεία;

Header.php – το αρχείο με το περιεχόμενο το οποίο διαβάζει πρώτα ο browser μας αφού βρίσκετε η κωδικοποίηση του template μας, το <head>, το <title> και τα javascript requests μας.
Index.php – το κεντρικό μας αρχείο όπου και περιέχει το WordPress Loop μέσα του, για την παραγογή των άρθρων και των σελίδων. Με βάση το index.php δημιουργείτε το categories.php το archives.php το tags.php και το
Single.php – Η σελίδα η οποία θα εμφανίζει ένα post μόνο του. Μπορούμε να χρησιμοποιήσουμε τον ίδιο κώδικα από το index.php αλλά συνήθως όταν σχεδιάζουμε ένα blog, στο τέλος προσθέτουμε κάποια extra features, όπως rating, related posts, social bookmark κτλ.
Category.php – καλείτε όταν κάνουμε click σε ένα από τα categories του site μας. Μπορούμε να του δώσουμε διαφορετικό design από την index ή ακριβώς το ίδιο, αφού το Loop από μόνο του αναλαμβάνει τα εμφανίσει τα posts τα οποία ανήκουν σε αυτή την κατηγορία.
Archive.php – Παρουσιάζει τα posts που έχουν γραφτεί σε κάποια χρονική περίοδο.
tags.php – Παρουσιάζει τα posts τα οποία σχετίζονται σε κάποιο tag
Page.php – το αρχείο το οποίο είναι υπεύθυνο για την εμφάνιση του περιεχομένου των σελίδων τα οποία δημιουργούμε. Μπορεί και αυτό να είναι είτε ίδιο με το index.php είτε να έχει τη δικιά του δομή και design.
Author.php – Η συγκεκριμένη σελίδα είναι βοηθητική. Κάποια blogs δεν τη χρησιμοποιούν καθόλου, άλλα την θεωρούν βασική. Αυτό που κάνει είναι, εάν δεν προσθέσετε extra κώδικα, να εμφανίζει τα posts που έχει γράψει ένας χρήστης.
Sidebar.php – Το αρχείο που εμφανίζει το περιεχόμενο του sidebar μας
search.php, searchform.php – Το αρχείο που εμφανίζει τις αναζητήσεις που κάνουν οι επισκέπτες στο blog μας, και το searchform.php είναι η φόρμα αναζήτησης της σελίδας μας.
Comments.php – το αρχείο το οποίο περιέχει την φόρμα για τα comments μας. Το ίδιο αρχείο φυσικά και διαχειρίζεται τα comments, τα trackbacks και τα pingbacks.

[i]Λίγο ποίο αναλυτικά…[/i]

Προχωρώντας στη δόμηση και τον σχεδιασμό του template μας, ας δούμε λίγο ποίο αναλυτικά τι έχουμε μέσα σε κάθε αρχείο:

1) Το DOCTYPE
2) Τα JavaScript αρχεία τα οποία θα χρειαστούμε
3) <?php bloginfo(‘stylesheet_directory’); ?> το directory με το CSS αρχείο μας
4) Το <title><?php bloginfo(‘name’); ?></title> το οποίο θα εμφανίσει στο html tag title, τον τίτλο του blog που έχετε ρυθμίσει εσείς από τις επιλογές του WordPress
5) Προσθέτουμε τα RSS feeds

κώδικας:



<link rel="alternate" type="application/rss+xml" title="RSS 2.0" href="<?php bloginfo('rss2_url'); ?>" /><link rel="alternate" type="text/xml" title="RSS .92" href="<?php bloginfo('rss_url'); ?>" /><link rel="alternate" type="application/atom+xml" title="Atom 0.3" href="<?php bloginfo('atom_url'); ?>" /><link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" />

Καλούμε και το <?php wp_head(); ?> το οποίο είναι μια από τις core hooks και το χρησιμοποιούν αρκετοί προγραμματιστές στα plugin τους για να τοποθετήσουν αρχεία μέσα στο header μας!

έχοντας φυσικά ακολουθήσει μία σωστή html δομή, το header μας είναι έτοιμο!

Index.php
Εδώ, είναι τα βασικά και τα ποίο δύσκολα. Αυτό που θα κάνουμε είναι να καλέσουμε

το header.php
το sidebar.php
να εμφανίσουμε το content
να καλέσουμε το footer.php

lets call header!

στην πρώτη γραμμή λοιπόν προσθέτουμε το

κώδικας:



 <?php get_header(); ?>

και αυτό θα μας καλέσει το header.php αρχείο.
Προχωρώντας θα δούμε λίγο την Loop μας.

κώδικας:



 <?php if (have_posts()) : while (have_posts()) : the_post(); ?> <!-- the LOOP -->

<!-- assigning post ID (dynamic) to every post so that you can control every single post -->  <div id="post-<?php the_ID(); ?>"> <?php //creat author page the_author_posts_link();  ?>

<!-- article published date & month --><div><?php the_time('M', '', ''); ?> <?php the_time('d', '', ''); ?></div>

<!-- the article title - linked so you can click and get into the article --><h1><a href="<?php the_permalink() ?>" rel="bookmark"><?php the_title(); ?></a></h1>

<!-- returns the list of categories under which that particular article is posted -->

<?php the_category(',') ?>

<!-- number shows the number of comments on that particular aticle -->

<?php comments_popup_link(__('( 0 ) Comments'), __('( 1 ) Comment'), __('( % ) Comments')); ?> <!—Wordpress thumbnail function from 2.9 -->

<?php the_post_thumbnail(); ?>

<!-- the content of the article --><div>

<?php the_content(__('more...')); ?></div> </div>

<!-- will inclued the comments.php file (displayed only when inside an article) - see below for the file-->

<?php comments_template(); ?>

<!-- end of the LOOP --> <?php endwhile; else: ?>

<p><!-- if LOOP fails, this text will be displayed -->

<?php _e('Sorry, no posts matched your criteria.'); ?></p>

<?php endif; ?>

<!-- end if the LOOP fails -->

Ο παραπάνω κώδικας μας είναι η main loop μας! Απλό δεν είναι; Νομίζω και τα σχόλια είναι αρκετά κατανοητά για να δείτε τι κάνει το κάθε κομμάτι. Εάν υπάρχει απορία παρόλα αυτά, drop us a comment!

Το τελευταίο μας κομάτι είναι να δημιουργήσουμε το αρχείο functions.php ( μέσα στο συγκεκριμένο αρχείο προσθέτουμε ότι κώδικα php θέλουμε να πηγαίνει «πακέτο» με το theme μας )

κώδικας:

if (  (function_exists('has_post_thumbnail')) && (has_post_thumbnail())  ) {

the_post_thumbnail();

} else {

$postimage = get_post_meta($post->ID, 'post-image', true);

if ($postimage) {

echo '<img src="'.$postimage.'" alt="" />';

}

}

Το συγκεκριμένο κομμάτι κώδικα προστήθεται με την έκδοση 2.9 και είναι για την δημιουργεία των αυτόματων thumbnails. Αν θέλετε μπορείτε να διαβάσετε περισσότερα
Αυτό που μένει τώρα είναι να καλέσουμε το sidebar και το footer… παρόλα αυτά, το έχουμε είδη κάνει νωρίστερα χρησιμοποιώντας μια γνωστή μας function!

κώδικας:

<?php get_header(); ?>

Για να καλέσουμε το sidebar.php τώρα απλώς γράφουμε

κώδικας:

<?php get_sidebar(); ?>

Και μετά για το footer.php

κώδικας:

<?php get_footer(); ?>

Πρίν δούμε το single.php ας τελειώσουμε το βασικό μας σκελετό

Το footer.php δεν χρεάζεται κάτι ιδαιέτερο εκτός από το κάλεσμα το footer hook, το οποίο και είναι

κώδικας:

<?php get_footer(); ?>

το sidebar.php παρόλα αυτά έχει αρκετή και σύνθετη δουλειά.

Καταρχήν για να δουλέψει σωστά πρέπει να προσθέσουμε την δυνατότητα των Widgets.
Προσθέτουμε λοιπόν μέσα στο functions.php το παρακάτω:

κώδικας:

if ( function_exists(‘register_sidebar’) )
register_sidebar(array(
‘name’ => ‘Homepage Widget 1′,
‘description’ => __(‘The main widget area, most often used as a sidebar.’, ‘example’),
‘before_widget’ => ‘<div>’,
‘after_widget’ => ‘</div>’,
‘before_title’ => ‘<h2>’,
‘after_title’ => ‘</h2>’,
));

Το οποίο δημιουργεί την function την οποία θα προσθέσουμε στο template μας για να μπορούμε να χρησιμοποιήσουμε τα Widgets του wordpress ( η παραπάνω function είναι συμβατή με WordPress 2.9+ ).

Τώρα λοιπόν προσθέτουμε στο sidebar.php την κλήση του Widget.

κώδικας:

<?php if ( !function_exists(‘dynamic_sidebar’) || !dynamic_sidebar(‘Homepage Widget 1′) ) : ?>
<?php endif; ?>

And Voila! Τώρα μπορείτε από τον πίνακα ελέγχου να προσθέσετε widgets μέσα στο template σας!

Finally…
Τα βασικά τελειώσανε. Αν περάσετε τώρα τα αρχεία αυτά μέσα στο wp-admin/themes/template_name όπου template_name ο φάκελος που έχετε ορίσει, είστε έτοιμοι!
Ας δούμε όμως πώς να κάνουμε το Template μας λίγο καλύτερο!
Sidebar.php – Μιάς και ήταν το τελευταίο αρχείο που ασχοληθήκαμε ας το δούμε λίγο καλύτερα. Θα προσθέσουμε την φόρμα για την αναζήτηση. Πάνω λοιπόν από τα widgets, προσθέτουμε το εξής

κώδικας:

<!–search–>
<?php include (TEMPLATEPATH . ‘/searchform.php’); ?>

Το αρχείο searchform.php περιέχει τον εξής κώδικα:
<div id="searchform"> <form method="" action="<?php bloginfo('url'); ?>/"> <input type="text" value="<?php the_search_query(); ?>" name="s" id="s" /> <input type="submit" id="searchsubmit" value=" " /> </form></div>
Που φυσικά είναι η φόρμα μας για να στείλει το search query στο search.php. Το search.php περιέχει απλώς ένα query (κάντε copy paste το index.php)

Some tips!
Μερικά όμορφα tips που μπορείτε να ακολουθήσετε για να κάνετε ποίο χρηστικό το search page σας

κώδικας:

<h2>Search Results</h2>
<h1>Browsing search results for <strong>»<?php the_search_query() ?>»</strong>.</h1>

Για να δείξετε τα συνολικά search results

κώδικας:

<h2>Search Result for <?php /* Search Count */ $allsearch = &new WP_Query(«s=$s&showposts=-1″); $key = wp_specialchars($s, 1); $count = $allsearch->post_count; _e(»); _e(‘<span>’); echo $key; _e(‘</span>’); _e(‘ — ‘); echo $count . ‘ ‘; _e(‘articles’); wp_reset_query(); ?></h2>

Single.php – όπως αναφέραμε το αρχείο single.php εμφανίζει τον κώδικα που αντοιστειχεί στην εμφάνιση ενός άρθρου μόνο.

Το single.php είναι ακριβώς το ίδιο με το index.php μόνο που κάτω από το
<? the_content(); ?>
Προσθέτουμε το<?php comments_template(); ?>
το οποίο μας επιτρέπει να καλέσουμε τα comment forms!

Some tip!
Για να δούμε και μερικά tips που θα κάνουν το single.php ακόμη ποίο όμορφο για τους επισκέπτες μας!

Related posts
Μπορείτε να προσθέσετε τον παρακάτω κώδικα και θα σας δώσει τα related posts με βάση τα tags Που έχετε προσθέσει

κώδικας:

<?php
//for use in the loop, list 5 post titles related to first tag on current post
$tags = wp_get_post_tags($post->ID);
if ($tags) {
echo ‘Related Posts’;
$first_tag = $tags[0]->term_id;
$args=array(
‘tag__in’ => array($first_tag),
‘post__not_in’ => array($post->ID),
‘showposts’=>5,
‘caller_get_posts’=>1
);
$my_query = new WP_Query($args);
if( $my_query->have_posts() ) {
while ($my_query->have_posts()) : $my_query->the_post(); ?>
<p><a href=»<?php the_permalink() ?>» rel=»bookmark» title=»Permanent Link to <?php the_title_attribute(); ?>»><?php the_title(); ?></a></p>
<?php
endwhile;
}
}
?>

Θέλετε να προσθέσουμε και ένα Short Bio στο τέλος του Post για το συγγραφέα μας; Δεν είναι κάτι δύσκολο

κώδικας:

Και στο css file σας μέσα

κώδικας:

.box {
padding: 8px;
min-height: 60px;
background: #efefef;
}
.entry_author_image {
float: left;
background: #fff;
padding: 4px;
margin-right: 8px;
border-right: solid 1px #dfdfdf;
border-bottom: solid 1px #dfdfdf;
}

Comments.php
Το παρακάτω αρχείο είναι ίδιο για όλα τα templates, άρα απλώς παραθέτω ένα link, για όποιον το χρειάζεται. Στο συγκεκριμένο αρχείο εάν το διαβάσετε θα δείτε πως ο κώδικας του έχει πολλά tricks. Μπορείτε να δείτε τα περισσότερα μέσα από το Options Panel του WordPress στην επιλογή σχετικά με τα comments!

Can I style comments;
Φυσικά και μπορείτε. Μπορείτε να δείτε μερικούς τρόπους για να καταλάβετε πως λειτουργούνε.
http://www.darrenhoyt.com/2007/08/18/styling-your-wordpress-comments/

Μπορείτε ακόμη να δείτε ένα παράδειγμα πώς να δώσετε διαφορετικό style μόνο στα comments του Admin
http://5thirtyone.com/archives/774

Δείτε και μερικά comment tips ακόμη
http://www.instantshift.com/2009/02/08/30-most-wanted-wordpress-comments-page-hacks/

Archives.php
Εάν θέλετε το archives να είναι κάτι διαφορετικό από τα συνηθισμένα μπορείτε να κάνετε διάφορα tricks. Εμείς κάνουμε το εξής:

κώδικας:

Αναζήτηση: <?php include (TEMPLATEPATH . ‘/searchform.php’); ?>

<?php wp_tag_cloud(‘number=0′); ?>

<?php while(have_posts()) : the_post(); ?>
<h3 class=”archivehead”>Μηνιαία Posts</h3>

<?php wp_get_archives(‘type=monthly&show_count=1′) ?>

</ul>
<br />
<h3 class=”archivehead”>Όλα τα Posts!</h3>

<?php endwhile; ?>

Όπου εμφανίζουμε μια μηχανή αναζήτησης, τα posts με βάση τους μήνες και τα τελευταία 50 posts.

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

κώδικας:

<?php
/*
Template Name: Archives
*/
?>

Ο παραπάνω κώδικας χρησιμοποιείτε όταν θέλουμε να φτιάξουμε αρχεία php που θα χρησιμοποιήσουμε ως templates. Με τον τρόπο αυτό μπορούμε να έχουμε διαφορετικό design σε κάποιες σελίδες.
Αφού φτιάξουμε λοιπόν τη σελίδα μας, πηγένουμε στο Admin panel, δημιουργούμε μια νέα σελίδα και επιλέγουμε το συγκεκριμένο template. Το πεδίο content το αφήνουμε λευκό.

Author.php
Αφού λοιπόν φτιάξουμε τη σελίδα του author, αυτόματα αυτή αφού βασίζεται στον ίδιο κώδικα με το index.php θα μας δείξει τα Posts του συγκεκριμένου author που έχουμε επιλέξει. Ας καλέσουμε παρόλα αυτά μερικές επιλογές από το Admin Panel και το user info.

Ανοίξτε το αρχείο και πάνω από το WordPress loop προσθέστε

κώδικας:

<?php
if(isset($_GET['author_name'])) :
$curauth = get_userdatabylogin($author_name);
else :
$curauth = get_userdata(intval($author));
endif;
?>
<h2>About: <?php echo $curauth->nickname; ?></h2>
Website
<a href=»<?php echo $curauth->user_url; ?>»><?php echo $curauth->user_url; ?></a><br />
Profile
<?php echo $curauth->user_description; ?><br />
Last Name
<?php echo $curauth->last_name; ?><br />
First Name
<?php echo $curauth->first_name; ?><br />
<h2>Posts by <?php echo $curauth->nickname; ?>:</h2>

Μερικά Loop Info!

Ίσως κάποιες φορές χρειαστείτε να φτιάξετε πολαπλά loops μέσα στο template σας. Ο ποίο απλώς κώδικας για να το κάνετε είναι ο παρακάτω:
<?php $my_query = new WP_Query('category_name=Featured&showposts=5'); while ($my_query->have_posts()) : $my_query->the_post(); $do_not_duplicate = $post->ID; ?>  <?php endwhile; ?>

Νομίζω είναι αρκετά κατανοητό τι πρέπει να αλλαχτεί για τα παίξει το loop σας σε άλλη κατηγορία ή με άλλο αριθμό Posts

Αυτό είναι ένα από τα βασικά που θα χρειαστείτε. Περισσότερα για τα Query info’s εδώ: http://codex.wordpress.org/Template_Tags/query_posts

Μπορείτε να βρείτε ότι extra πληροφορίες χρειάζεστε απο το codex
http://codex.wordpress.org

Το turorial αυτό πρωτοδημοσιεύτηκε στο Freestuff.gr και έχει δημιουργηθεί απο τον Βασίλη Κανονίδη(http://www.twitter.com/Basilakis) Co-Founder της creativeG.
Hope you like it!

Καλές γιορτές σε όλους!

Ταχύτητα: Σημείο κλειδί για την επιτυχία μιας σελίδας(4)

Θα ξεκινήσουμε αυτό το άρθρο τονίζοντας κάτι που δεν είναι διαδεδομένο στο ελληνικό web, για την ακρίβεια τυχαίνει πολλές φορές ακόμη και έμπειροι webmasters να το παραλείψουν. Είναι ο «κανόνας των 8 δευτερολέπτων» ή όπως είναι γνωστό με την αγγλική ονομασία του, “the 8 second rule”. Απο μόνος του αυτός ο κανόνας, που αποτελεί ολόκληρη φιλοσοφία γύρω απο το web design, θα μπορούσε να καλύψει ένα άρθρο. Εμείς θα παραθέσουμε το νόημα του εν συντομία και θα αποτελέσει την πηγή μας για το υπόλοιπο άρθρο.

Ο «κανόνας» αυτός ισχύριζεται κάτι πολύ απλό. Εάν μια σελίδα χρειάζεται περισσότερο απο 8 δευτερόλεπτα για να φορτώσει (υπο κανονικές συνθήκες πάντα) τότε υπάρχουν πολλοί μεγάλες πιθανότητες να δυσαρεστηθεί ο επισκέπτης και να την κλείσει. Φυσικά υπάρχουν εξίσου μεγάλες πιθανότητες αυτή η δυσαρέσκεια να οδηγήσει στον μαυροπινακισμό της σελίδας σας και να μην την ξαναεπισκεφθεί.

Για να αποφύγουμε αυτό το δυσάρεστο φαινόμενο, πρέπει να προσέχουμε πάρα πολύ στην επιλογή του παροχέα υπηρεσιών hosting(καλό είναι μάλιστα να κοιτάμε σχολαστικά τους χρόνους απόκρισης άλλων σελίδων που φιλοξενούνται στους server του hoster καθώς και που είναι το datacenter), να έχουμε ένα έξυπνο design στη σελίδα μας, χρησιμοποιόντας σωστά format εικόνας(π.χ .png & .gif) καθώς και να μην έχουμε υπερφορτώσει τη σελίδα με «βαριά» γραφικά και χρονοβόρα στη φόρτωση scripts.

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

H ταχύτητα φόρτωσης μιας σελίδας, κρύβει περισσότερους κινδύνους αλλα και οφέλη απ’ότι οι περισσότεροι webmasters φαντάζονται. Καλό είναι λοιπόν και εμείς ίδιοι είτε αν δημιουργούμε μόνοι μας τη σελίδα είτε αν απευθυνόμαστε σε εταιρία του χώρου να θέσουμε κάποια “guidelines”, κάποιους στόχους σε αυτό το τομέα που θα πρέπει να τηρήσουμε.

Μετά τιμής,
inBlogger

Η ελευθερία των bloggers, η σιωπή των αναγνωστών(4)

Με αφορμή κάτι που παρατηρώ εδώ και καιρό θα μιλήσω αυτή τη φορά για την ελευθερία του λόγου στα blogs. Η ελευθερία που δίνεται σε καθέναν απο εμάς να εκφράσει τη γνώμη του σε ένα ιστολόγιο είναι ένα μοναδικό προνόμιο αλλα παρόλαυτα συνεπάγεται και κάποιων-μέσα σε συγκεκριμένα πλαίσια- ευθυνών. Ευθυνών προς τους αναγνώστες μας, ευθυνών προς εμάς τους ίδιους. Είναι απο τις λίγες φορές που προτιμώ να ξεφύγω απο τα συνηθισμένα και την πιο συγκεκριμένη θεματολογία του inBlog προκειμένου να εκφράσω κάτι που με «καιει». Κάτι το οποίο όσοι το λάβουνε υπ’όψην τους και το εφαρμόσουν θα «ομορφύνουν» το διαδίκτυο, θα του δώσουν μια άλλη νότα..

Αρκετά με τις εισαγωγές όμως. Αυτό που έχω παρατηρήσει και πειραματίστικα για να το αποδείξω, και να είμαι σε θέση να μπορώ να υποστηρίξω ότι γράφω, είναι πως στην μεγαλύτερη πλειοψηφία τους οι bloggers όταν ελέγχουν οι ίδιοι τα σχόλια που γράφουν οι αναγνώστες στα άρθρα τους εγκρίνουν και δημοσιοποιούν μόνο τα θετικά. Οποιοδήποτε σχόλιο έχει αρνητικό ύφος ή κατακρίνει το άρθρο ή ακόμη απλώς δεν συμφωνεί και παραθέτει μια αντίθετη γνώμη πολλές φορές διαγράφεται απευθείας. Σίγουρα βολικό και έξυπνο για τον συγγραφέα, να έχει ένα ιστολόγιο γεμάτο άρθρα και θετικά σχόλια! Όμως αυτό είναι αντίθετο με την ελευθερία που του έχει δώσει το ιστολόγιο. Όπως και ο ίδιος επιθυμεί και συνήθως απαιτεί να μην υπάρχει λογοκρισία τρίτων στον τρόπο που γράφει ή στο θέμα που αναφέρεται ανεξάρτητα πόσο ευαίσθητο είναι και ποιες καταστάσεις θήγει , κατ’αυτόν τον τρόπο οφείλει να επιτρέπει στους αναγνώστες του να γράψουν ότι θέλουν και να το δημοσιεύει.

Προσωπικά δεν το βρίσκω στο ελάχιστο θεμιτό, να απορρίπτεις όποιο σχόλιο δε σου γεμίζει το μάτι. Καλώς ή κακώς, δεν είναι δυνατό η γνώμη μας να είναι αρεστή σε όλους. Ίσα ίσα που πιστεύω πως αν υπάρχουν και αρνητικά σχόλια, αυξάνονται οι πιθανότητες να ξεκινήσει μια σειρά σχολίων-συζήτηση μεταξύ των αναγνωστών και να έχουμε ακόμη και έναν επικοδομητικό διάλογο.

Φυσικά, υπάρχουν και εξαιρέσεις όπως υβριστικά σχόλια τα οποία πρέπει να απορρίπτονται απευθείας. Ευτυχώς, υπάρχουν και κάποια «ηθικά» όρια τα οποία πρέπει να τηρούνται εφόσον θέλει ο blogger να συνεχίσει να υπάρχει online.

Γιατί καλό και άγιο το SEO, μάθαμε να βάζουμε και σωστά τις διαφημίσεις αλλα δεν καταλάβαμε δυστυχώς το αυτονόητο. Συνεχίζουμε τη μάχη μας για ένα καλύτερο ελληνικό διαδικτυακό κόσμο δυναμικά, όσοι επηρεάστηκαν απο αυτό το άρθρο και κατάλαβαν κανα δυο πραματάκια είναι καλό, όσοι δεν «ένοιωσαν»…θα επανέλθω μελλοντικά και όσο συχνα μου επιτρέπεται στο θέμα.

Μετά τιμής,

inBlogger

Όσοι ελευθερία λαμβάνουμε,τόση και ακόμη περισσότερη πρέπει να δίνουμε.