Οριζόντιο menu κατηγοριών στο WordPress 2.x.x-

Μια περιοχή για το WordPress, αυτή την δημοφιλή δωρεάν πλατφόρμα για blogging

Συντονιστές: WebDev Moderators, Super-Moderators, PHP Moderators

Απάντηση
Άβαταρ μέλους
denmis
Δημοσιεύσεις: 2
Εγγραφή: 09 Μάιος 2007 11:37

Οριζόντιο menu κατηγοριών στο WordPress 2.x.x-

Δημοσίευση από denmis » 10 Μάιος 2007 00:20

( :roll: Για την υλοποίηση του οδηγού αυτού απαραίτητη προυπόθεση είναι η γνώση βασικών σημείων της php,wp-comands και css..)

Στο 99% των θεμάτων wordpress,οι κατηγορίες εμφανίζονται στην πλευρική στήλη μαζί με meta description και άλλες διακατατάξεις.Στον οδηγό αυτό,θα σας δείξω πώς μπορείτε να φτιάξετε ένα οριζόντιο menu που θα αποτελείται απο κατηγορίες και όχι απο σελίδες.Θα χρειαστούμε ένα καλό editor (προτείνω απο την εμπειρία μου dreamwaver mx,cs3) και το wordpress να είναι επιτυχώς εγκατεστημένο στον server μας.

[BHMA 1] :hammer:
Διμηουργήστε τις κατηγορίες που επιθυμείτε μέσω του wp-admin panel.Μόλις έχετε εισάγει τις κατηγορίες,πηγαίνετε στη σελίδα διαχείρησης των ΚΑΤΗΓΟΡΙΩΝ.Στην αριστερή κάθετη στήλη εμφανίζονται οι αριθμοί "id" της κάθε κατηγορίας.Για να έχουμε πρόσβαση στην κάθε κατηγορία μέσω του browser μας,θα πρέπει να πληκτρολογήσουμε το εξής link "http://www.yoursite.gr/?cat=id" όπου id ο αριθμός id που αντιστοιχεί σε κάθε κατηγορία.Κρατήστε αυτό με τα idz στο μυαλό σας..
[ΒΗΜΑ 2] :pint:
Τώρα,θα πρέπει να ανοίξετε στον editor το αρχείο /wp-content/themes/yourtheme/sidebar.php
Διαγράψτε το function: <?php wp_list_categories('title_li=' . __('Categories:')); ?>
Εάν επιθυμείτε το μενού που θα φτιάξουμε να περιέχει και pages,διαγράψτε και το <?php wp_list_pages('title_li=' . __('Pages:')); ?>
Αποθηκεύστε το τροποποιημένο αρχείο sidebar.php στο remote server σας.
[ΒΗΜΑ 3] :violi:
Ανοίξτε το αρχείο header.php
Ακριβώς κάτω απο το
<div id="header">
<div id="headerimg">
<div class="description"><?php bloginfo('description'); ?></div>
</div>
</div>

βάλτε τον κωδικό αυτό που αποτελεί και το navigation menu που θέλουμε..

<div id="navmenu">
<ul>
<li><a href="<?php echo get_settings('home'); ?>"></a></li>
<li><a href="http://www.yoursite.gr/?page_id=4"></a></li>
<li><a href="http://www.yoursite.gr/?cat=3"></a></li>
<li><a href="http://www.yoursite.gr/?cat=4"></a></li>
<li><a href="http://www.yoursite.gr/?cat=5"></a></li>
<li><a href="http://www.yoursite.gr/?cat=6"></a></li>
<li><a href="http://www.yoursite.gr/?cat=7"></a></li>
<li><a href="http://www.yoursite.gr/?cat=8"></a></li>
<li><a href="http://www.yoursite.gr/?cat=9"></a></li>
<li><a href="http://www.yoursite.gr/?cat=11"></a></li>
</ul>
</div>

Αντικαταστήστε το <a href="http://www.bodle.gr/?page_id=4"> με το id της κατηγορίας που αντιστοιχεί.Το όνομα της κατηγορίας το εισάγετε μεταξύ > και </a> σε κάθε σειρά του κωδικού.Θυμηθείτε πως εάν γράψετε στα Ελληνικά θα πρέπει το έγγραφο header.php να μεταρυθμιστεί σε κωδικοποίηση UTF-8 (Για το dreamwaver,πατήστε το design tub,κάντε δεξί κλίκ πάνω στην επιφάνεια του εγγράφου>design properties (popup)>Title/encoding>encoding (dropdown menu)>Unicode UTF-8)
Αποθηκεύστε το αρχείο header.php στο remote server..
[ΒΗΜΑ 4] :strong:
Ανοίγουμε για το τέλος και το style.css αρχείο.Μέσα εκεί λοιπόν,πάμε linkάρουμε το menu μας,ωστε να το εξάγουμε οριζοντίως και όχι χαοτικώς :doh:
Βάζουμε το εξής..
#navmenu ul {margin: 0; padding: 0;
list-style-type: none; list-style-image: none; }
#navmenu li {display: inline; }

Φυσικά μπορείτε να κάνετε και άλλα tricks με το css,σας παραπέμπω στα css tutorials και για όσους χρησιμοποιούν dreamwaver,πατήστε κάτω στον πάτο της οθόνης το "results" οπου μπορείτε να κάνετε browse όλα τα css commands..
:yea: :reading:
Για όσους ψάχνονται με το θέμα,κάντε ερωτήσεις,πιθανόν να φανώ χρήσιμος :D
Code is poetry-WordPress for ever!
bodle.gr-Your next level community

Άβαταρ μέλους
EkLekTos
WebDev Moderator
Δημοσιεύσεις: 7421
Εγγραφή: 07 Απρ 2005 15:44
Τοποθεσία: Inside the Effects
Επικοινωνία:

Οριζόντιο menu κατηγοριών στο WordPress 2.x.x-

Δημοσίευση από EkLekTos » 10 Μάιος 2007 05:21

Πολύ καλό βοήθημα και θα το χρησιμοποιήσω σίγουρα... :clap:
* Apple Technical Support Specialist *
* Apple Sales & Product Professional Certificate since 2011 * Εικόνα
Follow me @Twitter

harrinho
Δημοσιεύσεις: 11
Εγγραφή: 05 Ιουν 2009 17:04

Οριζόντιο menu κατηγοριών στο WordPress 2.x.x-

Δημοσίευση από harrinho » 26 Ιουν 2009 01:50

Denmis, τον κωδικα

#navmenu ul {margin: 0; padding: 0;
list-style-type: none; list-style-image: none; }
#navmenu li {display: inline; }

δεν εχω καταλάβει που ακριβως τον γράφουμε? Μπορείς να διαφωτισεις σε παρακαλώ? thanks!!

Άβαταρ μέλους
manolism
Super Moderator
Δημοσιεύσεις: 6652
Εγγραφή: 25 Ιαν 2004 16:01
Τοποθεσία: Wild West
Επικοινωνία:

Οριζόντιο menu κατηγοριών στο WordPress 2.x.x-

Δημοσίευση από manolism » 26 Ιουν 2009 12:55

denmis έγραψε:Ανοίγουμε για το τέλος και το style.css αρχείο.Μέσα εκεί λοιπόν,πάμε linkάρουμε το menu μας,ωστε να το εξάγουμε οριζοντίως και όχι χαοτικώς :doh:
Βάζουμε το εξής..
#navmenu ul {margin: 0; padding: 0;
list-style-type: none; list-style-image: none; }
#navmenu li {display: inline; }

Yannakiz
Δημοσιεύσεις: 3
Εγγραφή: 20 Μαρ 2010 10:37
Τοποθεσία: Δράμα

Οριζόντιο menu κατηγοριών στο WordPress 2.x.x-

Δημοσίευση από Yannakiz » 20 Μαρ 2010 10:46

Για σου Φίλε καινούργιος στο Forum

Πολύ Καλό Θα το Δοκιμάζω Αμέσως

Εγώ απλός δημιουργούσα καινούργια σελίδα και για τίτλο έβαζα π.χ <a href="http://www.yoursite.gr/?cat=?"> όπου ? η κατηγορία που ήθελα.
Δεν δουλεύει όμως με όλα τα Templates

Απάντηση

Επιστροφή στο “WordPress γενικά”

Μέλη σε σύνδεση

Μέλη σε αυτήν τη Δ. Συζήτηση: Δεν υπάρχουν εγγεγραμμένα μέλη και 0 επισκέπτες