Base de connaissances
WordPress
Présentation
Cette rubrique contient tous les articles concernant le CMS WordPress.
Coeur
Le coeur de WordPress est souvent animé par de nombreux modules complémentaires permettant d’effectuer un site pratiquement sur-mesure.
Extensions
WordPress dénombres des milliers d’extensions. Nous documenterons ici l’utilisation et les modifications des extensions courantes et que nous utilisons
WooCommerce
La célèbre extension d’e-commerce permettant de transformer un site WordPress en véritable plateforme de vente. Cette extension, bien qu’efficace et ergonomique reste conseillé dans le cas de la création d’une boutique de 20 à 30 articles (hors déclinaisons). Largement utilisée à l’étranger, elle souffre d’importantes lacunes au yeux du marché français pour ce qui est des modules tiers tels que les API bancaire ou les modules de transports. Il n’y a également que peu d’option dans les gestions des mails et aucune édition de factures automatiques. En résumé, une solution innovante et simple mais à recommander uniquement pour les sites les plus modestes.
Modifier le tableau de bord WooCommerce
Il peut parfois être nécessaire d’ajouter des éléments dans le menu “Mon Compte” WooCommerce. Pour ce faire, il suffit d’accéder au fichier /wp-content/plugins/woocommerce/templates/myaccount/dashboard.php
<p>
<?php
echo sprintf( esc_attr__( 'From your account dashboard you can view your %1$srecent orders%2$s, manage your %3$sshipping and billing addresses%2$s and %4$sedit your password and account details%2$s.', 'woocommerce' ), '<a href="' .
esc_url( wc_get_endpoint_url( 'orders' ) ) . '">', '</a>', '<a href="' . esc_url( wc_get_endpoint_url( 'edit-address' ) ) . '">',
'<a href="' . esc_url( wc_get_endpoint_url( 'edit-account' ) ) . '">' );
?>
</p>
<h2>Mes contrats</h2>
<?php echo do_shortcode("[emaillist]"); ?>
<h2>Mes documents</h2>
<?php echo do_shortcode("[list_user_files]"); ?>
<h2>Mes tickets d'incident</h2>
<?php echo do_shortcode("[fd_fetch_tickets]"); ?>
<p><a class="vc_general vc_btn3 vc_btn3-size-md vc_btn3-shape-square vc_btn3-style-flat vc_btn3-color-primary" href="https://www.navilog.fr/divers/demande-dassistance" target="_blank">Nouvelle demande d'assistance</a></p>
Les éléments apparaîtront désormais sur le tableau de bord de l’espace client WooCommerce.
FreshDesk
FreshDesk est un logiciel en ligne d’assistance technique. Il permet d’organiser une assistance par un système de tickets d’incidents pour rester organiser face à la demande des clients. Nous allons nous pencher sur l’intégration du plugin WP FreshDesk à WordPress et WooCommerce. Après l’installation du module, il est essentiel de configurer le SSO dans le logiciel FreshDesk et de générer les clés d’accès API dans l’onglet profil du compte (le compte doit avoir des droits administrateur). Pour que les tickets soient correctement affichés dans le tableau de bord WooCommerce, le fichier à modifier est situé dans /wp-content/plugins/wp-freshdesk/freshdesk.phpIl faudra ensuite modifier la fonction générant l’affichage des tickets pour en optimiser la lecture :
public function get_html( $tickets = '' ){
$html = '';
$tickets = json_decode( json_encode( $tickets ), FALSE );
$append = ( count( $tickets ) > 1 ) ? 's' : '';
$html .=
'<p>
<div class="fd-message">' . count( $tickets ) . ' ticket' . $append . ' found!</div>
</p>
<table>
<tr>
<td width="20%"><b>NUMÉRO DE TICKET</b></td>
<td width="60%"><b>TITRE</b></td>
<td width="20%"><b>ETAT</b></td>
</tr>
</table>
<hr style="border-width: 1px; border-color: #000;">';
foreach( $tickets as $d ) {
$class = ( $d->status_name == "Closed" ) ? 'status-closed' : '';
$diff = ( strtotime( date_i18n('Y-m-d H:i:s') ) - strtotime( date_i18n( 'Y-m-d H:i:s', false, 'gmt' ) ) );
$date = date_i18n( 'j M\' Y, g:i A', strtotime( $d->updated_at ) + $diff );
$description = ( strlen( $d->description ) > 125 ) ? strip_tags( substr( $d->description, 0, 125 ) ) . '...' : strip_tags( $d->description );
$time_elapsed = $this->timeAgo( date_i18n( 'Y-m-d H:i:s', strtotime( $d->updated_at ) + $diff ) );
$html .= '
<table class="ticket-data">
<tr>
<td class="ticket-id" width="20%"><b>#' . $d->display_id . '</b></td>
<td class="ticket-title" width="60%"><b>' . strip_tags( $d->subject ) . '</b></td>
<td class="ticket-status ' . $class . '" width="20%"><b>' . strip_tags( $d->status_name ) . '</b></td>
</tr>
<tr class="ticket-meta">
<td width="20%"><a href="' . $this->freshdeskUrl . 'helpdesk/tickets/' . $d->display_id . '" target="_blank" class="button view"> Voir le ticket</a></td>
<td class="ticket-excerpt" width="60%">' . $description . '</td>
<td class="ticket-time" width="20%"><abbr title="Last Updated on - ' . $date . '" class="timeago comment-time ticket-updated-at">' . $time_elapsed . '</abbr></td>
</tr>
</table>';
}
return $html;
}
Les tickets seront ainsi disposer de façon plus lisible pour les clients.
Subscriptio
Ce plugin permet de mettre en place des abonnements pour WooCommerce. Toutefois, certains éléments peuvent sembler manquants, par exemple, la possibilité d’effectuer une demande de résiliation en ligne. Pour ce faire, il suffit de modifier le fichier /wp-content/plugins/subscriptio/templates/myaccount/subscription-list.phppuis d’éditer la ligne suivante :
<td data-title="<?php _e('Recurring', 'subscriptio'); ?>" class="subscriptio_list_recurring"><?php echo $subscription->get_formatted_recurring_amount(); ?></td>
<td class="order-actions subscriptio_list_actions">
<?php foreach ($subscription->get_frontend_actions() as $action_key => $action): ?>
<a href="<?php echo $action['url']; ?>" class="button subscriptio_button_<?php echo sanitize_html_class($action_key); ?>"><?php echo $action['title']; ?></a>
<?php endforeach; ?>
<a href="https://www.navilog.fr/formulaire-de-resiliation/.html" class="button subscriptio_button_view">Résilier</a>
</td>
</tr>
Un bouton apparaîtra désormais dans l’interface client sur la fiche d’abonnement pour rediriger le client vers le formulaire de résiliation ou le lien de son choix.
Online Contracts
L’extension Online Contracts permet de générer des contrats à signer en ligne avec des fonctionnalités de capture de signatures manuscrites, d’horodatage et d’enregistrement d’IP. Différents shortcode sont possible pour proposer aux clients de consulter leur contrat sur leur espace client, ce qui permet de l’intégrer facilement à d’autres plugins, comme WooCommerce. Toutefois, la fonction de base du shortcode est peu lisible et esthétique, nous nous attarderons sur une méthode de présentation en tableau, bien plus lisible et pratique. Il faudra donc accéder au fichier plugins/onlinecontract/includes/functions.phppuis effectuer les modifications suivantes :
$signedstatus = '';
$html .= '<table><tr style="width: 100%">
<th style="color: #ffffff; background-color:#1e73be; width: 60%">Nom du contrat</th>
<th style="color: #ffffff; background-color:#1e73be; width: 20%">Etat</th>
<th style="color: #ffffff; background-color:#1e73be; width: 20%"></th>
</tr>';
while ( have_posts() ) : the_post();
if( get_post_meta( get_the_ID(), '_onlinecontract_contractshowsignature', true ) != 'on' ) {
$signed = 0;
$upload_dir = wp_upload_dir();
if ($handle = opendir($upload_dir['basedir'] . '/onlinecontract/signatures/')) {
while (false !== ($entry = readdir($handle))) {
if ($entry != "." && $entry != "..") {
$imgnamearr = explode('_',$entry);
if ($imgnamearr[0]==get_the_ID()) {
$fullimgname = $entry;
$signedstatus = '<span style="color: white; background-color: green; border-radius: 3px; padding: 2px 5px; font-size:15px;">'.__( 'Signed', 'onlinecontract' ).'</span>';
$signed = 1;
break;
}
}
}
if ($signed!=1) {
$signedstatus = '<span style="color: white; background-color: red; border-radius: 3px; padding: 2px 5px; font-size:15px;">'.__( 'Not Signed', 'onlinecontract' ).'</span>';
}
closedir($handle);
}
}else{
$signedstatus = '<span style="color: white; background-color: orange; border-radius: 3px; padding: 2px 5px; font-size:15px;">'.__( 'Signature Removed', 'onlinecontract' ).'</span>';
}
$contractdetails_duedate = get_post_meta( get_the_ID(), 'contractdetails_duedate');
$html .= '<tr>
<td style="width:60%">'.get_the_title().'</td>
<td style="width:20%">'.$signedstatus.'</td>
<td><a class="vc_general vc_btn3 vc_btn3-size-md vc_btn3-shape-square vc_btn3-style-flat vc_btn3-color-primary" href="'.get_permalink().'" target="_blank">Voir le contrat</a></td>
</tr>';
endwhile;
$html .= '</table>';
if (!$html) {
$html = '<div style="text-align:center;margin:20px 0;"><strong>Aucun contrat de disponible.</strong></div>';
}
wp_reset_query();
return $html;
}
Un tableau permettant de lister les contrats clients est désormais visible en utilisant le shortcode [emaillist].
BoxBilling
L’application BoxBilling est une application permettant de gérer la facturation par abonnement, les compte clients ainsi que l’hébergement. Cette application dispose de nombreux connecteurs. Nous nous attarderons ici sur l’intégration WordPress. IMPORTANT: Vous devez ajouter l’ID (si vous voulez l’utiliser pour un élément html) ou de classe (si vous voulez l’utiliser pour plusieurs éléments) dans l’ordre pour qu’il fonctionne. Ajouter un bouton de commande à vos éléments qui doivent appeler le popup. Par exemple :
<button class="order-button" type="button">Commander</button>
Ajouter des attributs de données-produit à votre élément pour ouvrir le produit spécifique. Par exemple :
<button class="order-button" type="button" data-product="2">Commander le produit 2</button>
La valeur de l’attribut données-produit sera réécrite si le popup du produit est sélectionné depuis la case ci-dessus. Il sera alors nécessaire d’intégrer le code suivant dans le site internet, AVANT la balise </head>.
<script type="text/javascript" src="http://****/bb-themes/huraga/assets/js/libs/jquery.js">// <![CDATA[ <script type="text/javascript" src="http://****/index.php?_url=/orderbutton/js&options=1&width=600&theme_color=blue&background_color=%23000000&background_opacity=50&background_close=1&bind_selector=.order-button&border_radius=0&loader=8"> // ]]></script>
