WordPress Hacks pour le site Web réservé aux membres

12

Par défaut, WordPress est un outil de blog. Néanmoins, vous pouvez vraiment personnaliser pour le faire comme vous le souhaitez. De nombreuses personnes utilisent WordPress pour créer un site Web réservé aux membres.

Vous pouvez toujours utiliser un plugin, mais si vous n'aviez besoin que d'une petite modification, pourquoi installer un plugin quand vous pouvez le faire avec quelques lignes de code. Voici quelques astuces simples mais efficaces pour créer un site réservé aux membres.

Contenu réservé aux membres sans plugin

S'il y a certains contenus sur votre site que vous vouliez montrer uniquement au membre enregistré, vous pouvez le faire en utilisant le code suivant dans votre thème. Tout ce qui se passe entre les deux is_user_logged_inne sera vu que par les membres.

<?php if (is_user_logged_in()) { ?>
// Content for Logged in user
<?php } else {?>
// Content for everyone else
<?php }?>

Afficher le formulaire de connexion WordPress n'importe où et le personnaliser

Si vous souhaitez inclure le formulaire de connexion WordPress n'importe où dans votre thème, vous pouvez le faire en utilisant la fonction suivante :

<?php ks29so_login_form(); ?>

Cependant, il ne vous donne pas la possibilité de personnaliser le formulaire de connexion, car il extrait directement le formulaire de connexion WordPress par défaut. Et si vous vouliez montrer quelque chose comme ça ?

Voici le code pour le faire. Collez le code suivant à l'endroit où vous souhaitez que le formulaire apparaisse.

// WordPress Login Form
<?php if (!(current_user_can('level_0′))){ ?>
<h3>Member Login</h3>
<form action="<?php echo get_option('home'); ?>/wp-login.php" method="post">
<table width='100%’ cellspacing="0" cellpadding="0">
<tr>
<td>
<label><?php _e( ‘Username’) ?></label>
<input type="text" name="log" class="input" value="<?php echo attribute_escape(stripslashes($user_login)); ?>" />
</td>
<td>
<label><?php _e( ‘Password’) ?></label>
<input type="password" name="pwd" class="input" value="" />
</td>
</tr>
<tr>
<td colspan="2"><?php do_action(‘login_form’); ?>
</td>
</tr>
<tr>
<td>
<a href="<?php echo site_url(‘wp-login.php?action=lostpassword’, ‘login’) ?>" title="<?php _e(‘Password Lost and Found’) ?>"><?php _e(‘Forgot Password?’) ?></a>
</td>
<td>
<input type="submit" name="submit" value="Log In" class="button" />
<input type="hidden" name="redirect_to" value="http://<?php echo $_SERVER['SERVER_NAME']. $_SERVER['REQUEST_URI'] ?>" />
</td>
</tr>
</table>
</form>
<?php } else { ?>
<!– When User logged in Show the following info –>
<h2>Logout</h2>
<?php get_currentuserinfo();?>
Welcome Back  <?php echo($current_user->user_login. " ");?><br />
<a href="<?php echo ks29so_logout_url(urlencode($_SERVER['REQUEST_URI'])); ?>">Logout</a><br />
<a href="<?php echo get_admin_url(); ?>">Admin?</a><!– If you are admin goes to admin dashboard –>
<?php }?>

Vous pouvez ajouter une balise CSS div pour le styliser. L'avantage d'utiliser ce formulaire de connexion, vous pouvez presque créer un mini tableau de bord pour les membres en utilisant la fonction get_currentuserinfo() et afficher toutes les informations sur l'utilisateur.

Menu WordPress personnalisé pour les membres

Comme le contenu, vous pouvez créer un menu WordPress personnalisé pour les membres. Commençons par enregistrer le menu. Accédez au fichier de fonction de votre thème (functions.php). Utilisez le code suivant pour enregistrer les menus.

register_nav_menus( array(
‘primary’ => __( ‘Primary Navigation’, ‘twentyten’ ),
‘visitor’ => __( ‘Visitor Navigation’, ‘twentyten’ ),
‘footer’ => __( ‘Footer Navigation’, ‘twentyten’ ),) );

Maintenant, placez le code suivant à l'endroit où vous souhaitez que votre menu apparaisse, probablement dans le fichier header.php.

<?php
if (is_user_logged_in()) {
ks29so_nav_menu( array( ‘container_class’ => ‘menu-header’, ‘theme_location’ => ‘primary’) );
} else {
ks29so_nav_menu( array( ‘container_class’ => ‘menu-header’, ‘theme_location’ => ‘visitor’) );
};?>

Maintenant, vous devez réellement créer le menu sur le revers de WordPress. Le paramètre "Menus" doit se trouver sous l'onglet Apparence. Créez un menu avec le nom principal et visiteur. Dans les deux menus, ajoutez ce que vous voulez afficher. Par exemple : si vous souhaitez qu'une page s'affiche uniquement lorsque l'utilisateur est connecté, ajoutez-le dans le menu principal.

Vous pouvez également créer un menu de pied de page dynamique en utilisant la même méthode.

Champs personnalisés WordPress et hacks pour les blogueurs

Vous pouvez utiliser WordPress pour créer un site Web personnalisé et d'aspect professionnel. Dans cet article, nous partageons quelques astuces et hacks de champ personnalisés WordPress qui vous permettront d'avoir un meilleur site alimenté par WordPress.

Parfois, il peut y avoir des blogueurs invités qui n'écrivent qu'un seul article sur votre site et c'est tout. Vous pouvez utiliser cette méthode pour afficher des informations régulières sur l'auteur. Gardez à l'esprit que l'auteur a été enregistré dans WordPress. Peut-être que vous ne voulez pas vous inscrire à chaque fois qu'un nouvel auteur invité écrit. Mais, comment faites-vous pour que les informations sur l'auteur invité s'affichent toujours dans le même format que l'auteur régulier ? Les champs personnalisés!

Nom de l'auteur invité sur la page d'accueil et les messages individuels

La première chose que nous devons faire est de définir une instruction WordPress if pour obtenir la valeur du champ personnalisé. De cette façon, il n'apparaîtra que lorsque la valeur du fichier personnalisé est attribuée. Ouvrez votre "index.php" et "single.php" et collez le code suivant où vous voulez que le nom de l'auteur apparaisse. Cela pourrait être après la date ou après les commentaires. Par exemple après ce code :

<?php the_time(‘M j, Y’) ?>
< ?php if (get_post_meta($post->ID, 'guest_author_name', true)) { ?>
// check to see if custom field guest author name exists
< ?php echo get_post_meta($post->ID, "guest_author_name", $single = true); ?>
< ?php } ?>

Une fois que nous avons mis l'instruction if, nous l'appelons simplement sur n'importe quel message où nous voulons que le nom de l'auteur invité apparaisse. Le nom de l'auteur invité doit apparaître sur la page d'accueil et pour un article spécifique uniquement.

Bloc d'informations sur l'auteur invité sur une publication individuelle

D'accord, nous avons donc le nom qui apparaît dans la méta description de l'article, mais quelques informations sur l'auteur invité seraient également utiles.

Encore une fois, nous avons d'abord une instruction conditionnelle if qui recherche le pouce et la description de l'image de l'auteur. N'oubliez pas de changer l'image du répertoire. De plus, nous avons attaché une classe au bloc et au pouce, cela permet de styliser à la fois l'image et le bloc en utilisant CSS.

<?php if (get_post_meta($post->ID, ‘autho_thumb’, true)) { ?> // checks to see if the custom field exist
<div class="writer_bio">
<img class="autho_thumb" src="http://media.webdesignviews.com/author/<?php $values = get_post_custom_values("autho_thumb"); echo $values[0]; ?>" alt="Author Thumb" width="60" width="60" height="60" /><?php }? <?php if (get_post_meta($post->ID, ‘guest_author’, true)) { ?>
<?php echo get_post_meta($post->ID, "guest_author", $single = true); ?></div>
<?php } ?>

Voici le CSS que j'ai utilisé

.writer_bio {
color: #666;
background: #eee;
text-transform: none !important;
font-size: 13px;
font-weight: normal;
height: 75px;
width: 600px;
padding: 6px;
padding-bottom: 6px;
padding-left: 0;
margin-bottom: 10px;
}
.writer_bio img {
padding: 0 !important;
float: left !important;
margin-left: 4px !important;
margin-top: 3px !important;
border: 2px #ccc solid !important;
height: 60px;
}

Vous stylisez encore plus avec la classe autho_thumb. Une fois cela fait, tout ce que vous avez à faire est d'ajouter autho_thumb et guest_author dans le champ et de remplir les informations. Vous pouvez même ajouter du code HTML tel qu'un lien dans un champ personnalisé.

Donc, vous avez là deux champs personnalisés pour les informations sur l'auteur invité. Cela peut sembler beaucoup d'étapes. Croyez-moi une fois que vous l'avez fait, il suffit d'ajouter l'image et la description la prochaine fois que vous voulez le faire.

Meilleur champ personnalisé pour afficher l'image de la publication sur la page d'accueil

Cette méthode est utilisée pour afficher un pouce pour le poste sur le devant. Je voulais aller un peu plus loin et rendre facile pour l'utilisateur frontal. De plus, avec la méthode de Jean, toutes les images auraient le même alt = "post-image" et je ne serais peut-être pas bon pour les moteurs de recherche. De plus, vous devrez inclure l'URL complète des images à chaque fois. Voici d'abord le code :

<?php $postimageurl = get_post_meta($post->ID, ‘post-img’, true);
// variable for image
$image_alt = get_post_meta($post->ID, ‘post-img’, true);// variable for description
// check if the the custom field is called
if ($postimageurl) {
?>
<a href="<?php the_permalink(); ?>" rel="bookmark"><img src="<?php echo $postimageurl; ?>" class=
quot;post-img" alt="<?php echo $image_alt; ?>"; width="500" height="300" /></a>
<?php } else { ?>

Avant d'expliquer le code, notez que je n'ai pas ajouté d'instruction else pour un pouce par défaut. Regardez le message de Jean si vous souhaitez avoir une image par défaut si l'image est attribuée dans un champ personnalisé.

Nous avons d'abord deux variables $postimageurl et $image_alt. La première consiste à obtenir l'emplacement de l'image et la seconde consiste à ajouter le nom de l'image. Ensuite, nous définissons une instruction if pour vérifier si le champ personnalisé est appelé.

<?php echo get_option(‘siteurl’).‘/wp-content/uploads/thumb/’?>

La chose différente est au-dessus du code qui obtient l'emplacement de l'image. J'ai créé un dossier appelé pouce dans mon répertoire de téléchargement WordPress, donc plutôt que de taper l'URL entière à chaque fois, je taperais simplement le nom de l'image, une fois que j'aurais téléchargé l'image dans le dossier.

Si vous voulez un répertoire différent, par exemple, vous stockez vos images à la racine de votre domaine, remplacez-le simplement <?php echo get_option(‘siteurl’).‘/wp-content/uploads/thumb/ ?><?php echo $postimageurl; ?>par http://yourwebsite.com/images/<?php echo $postimageurl; ?>.

Ainsi, le code est un peu modifié afin que chaque image de publication ait un alt (titre) différent et que vous tapiez l'extension du nom de l'image plutôt que l'URL entière.

Organisez votre navigation WordPress comme vous le souhaitez

La première chose à savoir est les pages de liste wordpress utilisant la balise ks29so_list_pages, qui se trouve généralement dans header.php. mais vous ne voudrez peut-être pas répertorier toutes vos pages. Si vous souhaitez empêcher l'affichage de certaines de vos pages, procédez comme suit :

<?php ks29so_list_pages(‘include=7,13′ ); ?>
//or
<?php ks29so_list_pages(‘exclude=5,9′);? >

Exclure ou inclure fonctionne presque de la même manière. Exclure omettra certaines pages de la liste de pages WordPress et n'inclura que l'ID de pages que vous spécifiez. Cependant, la plupart des blogs de conception Web ou de tout autre blog aiment utiliser des balises ou des catégories comme navigation. Dans ce cas, vous pouvez simplement vous débarrasser de la balise ks29so_list et personnaliser la navigation. Alternativement, vous pouvez également le faire avec vos balises. L'avantage de coder de cette façon vous permet d'attribuer une classe CSS pour styliser chaque élément de la navigation.

Comment trouver votre ID de page WordPress

J'ai récemment dû trouver un ID de page à exclure dans un modèle que j'utilisais et après environ 10 minutes, j'ai finalement trouvé un moyen simple de trouver l'ID de page d'une "page" WordPress.

Dans les anciennes versions de WordPress, je pense que c'était plus facile, mais voici comment vous pouvez le faire maintenant.

  1. Allez dans le panneau d'administration WordPress puis allez dans Pages.
  2. Passez ensuite la souris sur la page dont vous souhaitez connaître l'ID.
  3. Vous verrez l'ID dans la barre d'état en bas du navigateur (voir ci-dessous).

Si vous ne pouvez pas voir l'adresse complète, essayez une autre méthode (ci-dessous).

  1. Allez dans le panneau d'administration WordPress puis allez dans Pages.
  2. Ensuite, vous verrez l'ID dans la barre d'adresse. Ce sera le nombre après le signe égal.
  3. Cliquez sur la page dont vous souhaitez connaître l'ID.

Affichage du sujet d'archive

La plupart des thèmes WordPress sont livrés avec la page archive.php. Mais j'ai vu de nombreux sites Web où les pages d'archives ne sont pas très utiles et n'indiquent pas aux utilisateurs le sujet ou les catégories qu'ils parcourent. Vous pouvez ajouter les codes suivants dans votre archive.php pour éviter toute confusion.

<?php /* If this is a category archive */ if (is_category()) { ?>
<h3 class="pagetitle">Current Browsing Topic: ‘<?php single_cat_title(); ?>’</h3>
<?php /* If this is a tag archive */ } elseif( is_tag()) { ?>
<h3 class="pagetitle">Posts Tagged ‘<?php single_tag_title(); ?>’</h3>

This website uses cookies to improve your experience. We'll assume you're ok with this, but you can opt-out if you wish. Accept Read More