- Home
- Categorie
- Coding e Sistemistica
- WordPress
- Articolo precedente e articolo successivo
-
Ciao Franz22.
Non conosco plugin perché non li ho cercati.
Al plugin bello e pronto anche nella grafica hai due possibilità:- provare a modificare la grafica del plugin che hai;
- eliminare il plugin e inserire codice e grafica da zero.
Con la prima soluzione non posso aiutarti perché non ho il plugin installato (qualunque esso sia) e al momento c'ho la palla di vetro rotta
Con la seconda soluzione ti posto tutto qui nel topic, ma solo se ti serve davvero e mi dai qualche giorno.
Fammi sapere.
Ciao.;)
F.
-
guarda se riuscissi davvero a postarmi come fare inserendo il codice e grafica da zero, beh, saresti sin troppo gentile
-
Ciao Franz22.
Appena ho una mezz'ora faccio una prova su uno dei miei siti e, quando è tutto OK, ti posto qui il codice con le istruzioni.
A presto
F.
-
Scriviamo su 2 file:
- uno dei .css che carichi con gli articoli, ad esempio ../wp-content/themes/tuotemplate/style.css
- il .php che stampa il singolo post, ad esempio ../wp-content/themes/tuotemplate/single.php
Prima di aprirli fai una copia di backup.
La soluzione è stata testata su un WordPress 3.x.x, se hai una versione precedente potresti dovere modificare qualcosa.
Iniziamo dal foglio di stile. Apri il file con un editor e aggiungi alla fine:
/* Newt Prev Posts */ .npp-posts{ border:solid 1px #e0e0e0; margin-bottom:40px; font-size:13px; line-height:14px; padding: 20px 0 80px 0; } .npp-posts i{ color:#000; } .npp-posts a:link, .npp-posts a:visited{ color:#666; } .npp-next{ float:left; width:278px; height:60px; text-align:right; padding-left:20px; display: inline; } .npp-middle{ float:left; border-right:solid 1px; margin:0 20px; height:60px; width:1px; display: inline; } .npp-previous{ text-align:left; float:left; width:278px; height:60px; padding-right:20px; display: inline; } .npp-posts a:hover{ color:#ccc; } .npp-int{ color:#000; font-size:10px; margin-bottom:10px; font-weight:bold; text-transform:uppercase; } .npp-left{ float: left; margin-top:22px; margin-right:20px; color:#888; padding-bottom:10px; font-size: 2em; } .npp-right{ float:right; margin-top:22px; margin-left:20px; color:#888; padding-bottom:10px; font-size: 2em; }
Salva il .css e apri il .php: dove scrivere dipende da dove vuoi che compaia il box. Io preferisco che sia visualizzato dopo il post e prima dei commenti, ma alcuni lo inseriscono anche sopra. Fatta la tua scelta, comunque, copia e incolla questo:
// Inizio codice Next Prev Posts $post_precedente = get_previous_post(true); $post_successivo = get_next_post(true); echo "<div class='npp-posts'>"; echo "<div class='npp-next'>"; if (!empty($post_successivo)) echo "<div class='npp-int'><div class='npp-left'><</div>Successivo</div><a href=\"" . get_permalink($post_successivo->ID) . "\" title=\"" . $post_successivo->post_title . "\">" . get_the_title($post_successivo->ID) . "</a>"; echo "</div>"; echo "<div class='npp-middle'></div>"; echo "<div class='npp-previous'>"; if (!empty($post_precedente)) echo "<div class='npp-int'><div class='npp-right'>></div>Precedente</div><a href=\"" . get_permalink($post_precedente->ID) . "\" title=\"" . $post_precedente->post_title . "\">" . get_the_title($post_precedente->ID) . "</a>"; echo "</div>"; echo "</div>"; echo "<div style='clear: both'></div>"; //Fine codice next Prev Posts
Note:
- Il box che mi hai mostrato usa un metodo diverso per i simboli < e >, che sono font. Per velocizzare la pratica ed essere certo che funzionasse a tutti ho inserito semplici caratteri, ma l'effetto estetico lascia a desiderare. Puoi implementare quell'altra soluzione da te oppure giocare sul font nel .css (le classi sono npp-left e npp-right). In alternativa puoi usare un'icona, magari in sprite css (nel caso apri un topic nuovo e ti posto il codice già adatto al box).
- Nel mio caso avevo una larghezza di 640px e andava bene così, ma tu potresti avere esigenze diverse: agendo lato css dovresti risolvere tutto ... beh, non proprio tutto: se hai un sito responsive ti tocca fare qualche modifica. Nel caso dammi qualche info in più e cerco di aiutarti anche su questo.
- Se lo stile non ti piace puoi cambiarlo facilmente dal css.
Fammi sapere se è andato bene.
Saluti.
F.
-
Ciao Francesco,
ho inserito il tutto nel foglio di stile e in quella della singola pagina però secondo me devo modificare i richiami ai singoli articoli perché non riesce a richiamarne il titolo, probabilmente è il tema che uso che fa casini .
imageshack.com/a/img5/3719/fzzx.jpg
Detto questo, come ti ho detto in provato, è superlativo! Davvero fantastico ed è quello che cercavo da una vita!!
-
Ciao Franz22.
Mettiamo a posto una cosa alla volta.
Intanto la larghezza: la tua credo sia 620px, mentre io l'ho settato per 640px: devi rubare 10 px a sinistra e 10 px a destra. Prova a impostare nel CSS il width in npp-next e npp-previous a 268px.
Passiamo al perché non va. Faccio tre ipotesi:- Ti sei perso un div, aperto o chiuso, o comunque qualcosa del codice, un punto e virgola ... capita. A me spesso. Di solito me ne accorgo non prima di avere imprecato in tutte le lingue del mondo.
- C'è un problema con l'editor/il testo del codice copiato/la codifica. Ti faccio l'esempio di:
echo "<div class='npp-next'>";
A volte l'editor fa cose strane con " (le virgolette) e ' (apostrofo).
3) La versione di WordPress e/o, come tu ipotizzi, il template. Nota che get_permalink e get_the_title sono di WP.
Dai, cerchiamo di farlo funzionare ... per soddisfazione!
F.
-
Sono andato a dare un'occhiata al plugin WP Post Navigation che uso attualmente ma mi sembra che utilizzi la stessa "terminologia" no no devo riuscirci per forza a costo di perderci le ore guarda
-
Questo il php del plugin (spero si possa postare, in caso lo cancello)
<?php /*Check Version*/ global $wp_version; $exit_msg="WP Requires Latest version, Your version is old"; if(version_compare($wp_version, "3.0", "<")) { exit($exit_msg); } if(!class_exists(WPPostNavigation)): class WPPostNavigation{ function WP_Pre_Next_Navigation($content) { global $post; $options = $this->get_wp_post_navigation_options(); if(is_single()){ $navi = $options['nav_within_cat'] == "1"? true: false; $next_post = get_next_post($navi); $pre_post = get_previous_post($navi); if($options['navi_img'] != "1") { if($options['is_custom'] != "1"){ $pre_navigation = $pre_post->ID!=""?'<a href="'. get_permalink($pre_post->ID).'">'.$pre_post->post_title.'</a>':''; $next_navigation = $next_post->ID!=""?'<a href="'. get_permalink($next_post->ID).'">'.$next_post->post_title.'</a>':''; }else{ $pre_navigation = $pre_post->ID!=""?'<a href="'. get_permalink($pre_post->ID).'">'.$options['custom_pre'].'</a>':''; $next_navigation = $next_post->ID!=""?'<a href="'. get_permalink($next_post->ID).'">'.$options['custom_next'].'</a>':''; } }else{ $pre_navigation = $pre_post->ID!=""?'<a href="'. get_permalink($pre_post->ID).'"><img src="'.$options['pre_img_link'].'" /></a>':''; $next_navigation = $next_post->ID!=""?'<a href="'. get_permalink($next_post->ID).'"><img src="'.$options['next_img_link'].'" /></a>':''; } $img = $options['navi_img'] == "1"? "-1": ''; switch($options['position']){ case "both": return '<div class="wp-post-navigation"> <div class="wp-post-navigation-pre'.$img.'"> '.$pre_navigation.' </div> <div class="wp-post-navigation-next'.$img.'"> '.$next_navigation.' </div> </div>'.$content.'<div class="wp-post-navigation"> <div class="wp-post-navigation-pre'.$img.'"> '.$pre_navigation.' </div> <div class="wp-post-navigation-next'.$img.'"> '.$next_navigation.' </div> </div>'; break; case "top": return '<div class="wp-post-navigation"> <div class="wp-post-navigation-pre'.$img.'"> '.$pre_navigation.' </div> <div class="wp-post-navigation-next'.$img.'"> '.$next_navigation.' </div> </div>'.$content; break; case "bottom": return $content.'<div class="wp-post-navigation"> <div class="wp-post-navigation-pre'.$img.'"> '.$pre_navigation.' </div> <div class="wp-post-navigation-next'.$img.'"> '.$next_navigation.' </div> </div>'; break; } } return $content; } function handle_wp_post_navigation_options() { $settings = $this->get_wp_post_navigation_options(); if (isset($_POST['submitted'])) { //check security check_admin_referer('wp-post-navigation-by-sharp-coders'); $settings['nav_within_cat'] = isset($_POST['nav_within_cat'])? "1" : "0" ; $settings['position'] = isset($_POST['position'])? $_POST['position'] : "bottom" ; $settings['style'] = isset($_POST['style_css'])? $_POST['style_css'] : "" ; $settings['is_custom'] = isset($_POST['is_custom'])? "1" : "0" ; $settings['custom_pre'] = isset($_POST['custom_pre'])? $_POST['custom_pre'] : "" ; $settings['custom_next'] = isset($_POST['custom_next'])? $_POST['custom_next'] : "" ; $settings['navi_img'] = isset($_POST['navi_img'])? "1" : "0" ; $settings['pre_img_link'] = isset($_POST['pre_img_link'])? $_POST['pre_img_link'] : "" ; $settings['next_img_link'] = isset($_POST['next_img_link'])? $_POST['next_img_link'] : "" ; update_option("wp_post_navigation_options", serialize($settings)); echo '<div class="updated fade"><p>Setting Updated!</p></div>'; } $action_url = $_SERVER['REQUEST_URI']; include 'wp-post-navigation-admin-options.php'; } function get_wp_post_navigation_options() { $options = unserialize(get_option("wp_post_navigation_options")); return $options; } function WP_Post_Navigation_install() { $options = array( 'position' => 'bottom', 'nav_within_cat' => '1', 'style' => 'text-decoration: none; font:bold 16px sans-serif, arial; color: #666;', 'is_custom' => '0', 'custom_pre' => 'Previous Post', 'custom_next' => 'Next Post', 'navi_img' => '0', 'pre_img_link' => '', 'next_img_link' => '', ); add_option("wp_post_navigation_options", serialize($options)); } function wp_admin_menu() { add_options_page('WP Post Navigation', 'WP Post Navigation', 10, basename(__FILE__), array(&$this, 'handle_wp_post_navigation_options')); } function wp_post_navigation_stylesheet() { wp_register_style( 'wp-post-navigation-style', plugins_url('style.css', __FILE__) ); wp_enqueue_style( 'wp-post-navigation-style' ); } function wp_post_navigation_HeadAction() { $settings = $this->get_wp_post_navigation_options(); echo '<style type="text/css"> .wp-post-navigation a{ '.$settings['style'].' } </style>'; } } else: exit('WPPostNavigation Already Exists'); endif; $WPPostNavigation = new WPPostNavigation(); if(isset($WPPostNavigation)){ register_activation_hook(__FILE__, array(&$WPPostNavigation, 'WP_Post_Navigation_install')); add_filter('wp_head', array(&$WPPostNavigation, 'wp_post_navigation_HeadAction')); add_filter('the_content', array(&$WPPostNavigation, 'WP_Pre_Next_Navigation')); add_action('admin_menu', array(&$WPPostNavigation, 'wp_admin_menu')); add_action( 'wp_enqueue_scripts', array(&$WPPostNavigation, 'wp_post_navigation_stylesheet')); } ?>
-
@FDA said:
Ciao Franz22.
Mettiamo a posto una cosa alla volta.
Intanto la larghezza: la tua credo sia 620px, mentre io l'ho settato per 640px: devi rubare 10 px a sinistra e 10 px a destra. Prova a impostare nel CSS il width in npp-next e npp-previous a 268px.
Passiamo al perché non va. Faccio tre ipotesi:- Ti sei perso un div, aperto o chiuso, o comunque qualcosa del codice, un punto e virgola ... capita. A me spesso. Di solito me ne accorgo non prima di avere imprecato in tutte le lingue del mondo.
- C'è un problema con l'editor/il testo del codice copiato/la codifica. Ti faccio l'esempio di:
echo "<div class='npp-next'>";
A volte l'editor fa cose strane con " (le virgolette) e ' (apostrofo).
3) La versione di WordPress e/o, come tu ipotizzi, il template. Nota che get_permalink e get_the_title sono di WP.
Dai, cerchiamo di farlo funzionare ... per soddisfazione!
F.Sto diventando matto
Non capisco proprio perché non vada…è tutto esatto
-
Ciao Franz22.
Come già ti ho detto hai due possibilità:- lavorare sul mio codice, quindi capire perché a te non funziona;
- usare il plugin che già avevi, ma applicando lo stile che vuoi tu e che potresti copiare dal codice che ti ho postato.