logo

[functions et PHP] Intégrer un widget sur WordPress

[functions et PHP] Intégrer un widget sur WordPress

Il n’est pas du tout question d’un quelconque « hack » ici, mais il nous arrive de chercher les codes pour intégrer des widgets. En le mettant ici, nous sommes certains de le retrouver rapidement.

Dans votre thème php

 <!-- widget -->
<?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar("NOMduWiget") ) : ?> 
<p>Ici le texte ou le code par defaut</p>
<?php endif; ?>

 

Dans le fichier functions.php

<!-- widget -->
<?php 
if ( function_exists('register_sidebar') )

register_sidebar(array('name'=>'NOMduWiget',
'before_widget' => '',
'after_widget' => '',
'before_title' => '<h1>',
'after_title' => '</h1>',
));
?>

[PHP] Editer un « shortcode » dans le thème de WordPress

Parce qu’on a toujours besoin de le faire. Le shortcode se place généralement dans la partie « content » d’un billet ou d’une page. Mais dans le cas d’un formulaire de contact ou d’un formulaire d’abonnement à une newsletter on peut le placer directement dans le thème.

Dans votre thème en php

<?php echo do_shortcode( '[votre shortcode]' ); ?>

[functions] Ajouter un champs « extrait » pour les pages WordPress

Cette options est généralement utilisée pour les « articles », mais il n’est pas rare d’en avoir besoin pour afficher un extrait pour les pages WordPress.

Dans le fichier « functions.php »

/* Ajouter un champs extrait dans les pages */
add_action( 'init', 'add_excerpts_to_pages' );
function add_excerpts_to_pages() {
add_post_type_support( 'page', 'excerpt' );
}

Pour afficher l’extrait dans votre page php et dans la boucle

<?php the_excerpt();?>

 

 

 

 

 

 

[PHP] Afficher une page spécifique sur wordpress à partir de l’ID

Pour des raisons particulières, nos clients nous demandent parfois d’afficher plusieurs « pages » sur la page d’accueil. Nous entendons par « Page » ce qui n’est pas « Article ».

Une fois afficher la page (page d’accueil) sur la « page d’accueil » ou sur n’importe quelle autre page de votre thème (soit home.php ou autres) vous placerez la deuxième page où vous le souhaitez.

Dans votre thème en php (version simple)

<!-- Afficher un page spécifique : changer l'ID 15 par un autre chiffre -->

<?php 
$post_id =15; 
$queried_post = get_post($post_id);
$content = $queried_post->post_content; 
$title = $queried_post->post_title;
// $excerpt = $queried_post->post_excerpt;
?>
<h1><?php echo $title; ?></h1>
<p><?php echo $content; ?></p>
<p><?php echo $excerpt; ?></p><!-- si besoin -->

 

ou alors une méthode différente  … toujours dans votre thème en php et dans une boucle

 

<?php
// Custom query pour appeler une page
$prog = array(
'page_id' => '3111'
);
$query = new WP_Query( $prog );
// Condition
if ( $query->have_posts() ) {
// début de la boucle (loop)
while ( $query->have_posts() ) {
$query->the_post(); ?>
<h1><?php the_title(); ?></h1> 
<p><?php the_content();?></p>
<?php }
}
// Restoration du billet d'origine
wp_reset_postdata();
?>

 

 

 

 

[wp-config.php] Limiter le nombre de révisions

Parce que c’est souvent des sauvegardes inutiles qui encombre votre base de données.

Placez le code suivant dans le fichier « wp-config.php » à la base de votre site. Placer le code dès les premières lignes du fichier. Nous les avons limité à 2 révisions dans ce modèle.

/** Limiter le nombre de révisions des articles. */
define('WP_POST_REVISIONS', 2);

 

[functions + PHP] Afficher un thumbnail au hasard parmi les images d’un billet

Presque identique que la page afficher tous les thumbnails, qui donne la possibilité d’afficher tous les thumbnails pour les placer dans une galerie automatiquement, cette fonction permet d’afficher (avec un excerpt ou non) une des images au hasard sous forme de thumbnail.

Ce « petit » morceau de code (que nous vous conseillons de placer dans un autre fichier que functions.php à l’aide d’un « include ») vous aidera comme il se doit à afficher les images où et comme vous le souhaitez.

 

Dans le fichier functions.php avec ou sans « include » :

/** récupération des thumbnails **/ <?php
function get_post_images($args = array())
{
    global $post;

    $defaults = array(
        'number'        => -1,
        'order'         => 'ASC',
        'orderby'       => 'post_date',
        'output'        => OBJECT,
        'post_id'       => null,
        'preserve_keys' => false
    );
    $args = wp_parse_args($args, $defaults);

    $post_id = (int) $args['post_id'];
    if (0 === $post_id)
    {
        if (!in_the_loop())
        {
            return false;
        }

        $post_id = $post->ID;
    }
    extract($args, EXTR_SKIP);
    $attachments = false;
    $buf         = false;
    $number      = (int) $number;
    $number      = (0 === $number) ? -1 : $number;

    $order = strtoupper(trim($order));
    if ('ASC' !== $order && 'DESC' !== $order)
    {
        $order = 'ASC';
    }

    switch (strtolower(trim($orderby)))
    {
        case 'natural':
            $orderby = 'natural';
            break;
        case 'post_id':
            $orderby = 'ID';
            break;
        case 'post_date':
        default:
            $orderby = 'post_date_gmt';
            break;
    }

    if ('natural' !== $orderby)
    {
        $attachments = get_children(array(
            'order'          => $order,
            'orderby'        => $orderby,
            'numberposts'    => $number,
            'post_mime_type' => 'image',
            'post_parent'    => (int) $post_id,
            'post_status'    => 'inherit',
            'post_type'      => 'attachment'
        ));
    }

    if (!$attachments)
    {
        if ($post_id == $post->ID)
        {
            $post_content = $post->post_content;
        }
        else
        {
            $my_post = get_post($post_id);
            if (!$my_post)
            {
                return false;
            }
            $post_content = $my_post->post_content;
            unset($my_post);
        }

        $regexp = apply_filters('get_images_regexp', '#<\s*?img\s+.*?wp-image-(\d+)[^>]*>#i');
        if (1 === $number)
        {
            preg_match($regexp, $post_content, $matches);
            if (isset($matches[1]))
            {
                $matches = array($matches[1]);
            }
        }
        else
        {
            preg_match_all($regexp, $post_content, $matches);
            if (isset($matches[1]))
            {
                $matches = $matches[1];
            }
        }
        unset($regexp, $post_content);

        if ($matches_count = count($matches))
        {
            $stack = array();
            if (-1 === $number)
            {
                $c = $matches_count;
            }
            else if ($number < $matches_count)
            {
                $c = $number;
            }
            else
            {
                $c = $matches_count;
            }
            unset($matches_count, $number);

            for ($i = 0; $c > $i; ++$i)
            {
                $id = (int) $matches[$i];
                $stack[$id] = get_post($id);
            }

            if ('natural' === $orderby)
            {
                $attachments = $stack;
            }
            else
            {
                $tmp = array();
                foreach ($stack as $id => $attachment)
                {
                    $tmp[$id] = $attachment->$orderby;
                }
                natcasesort($tmp);

                foreach (array_keys($tmp) as $id)
                {
                    $attachments[$id] = $stack[$id];
                }
                unset($tmp, $attachment);

                if ('DESC' === $order)
                {
                    $attachments = array_reverse($attachments, true);
                }
            }
            unset($stack, $id, $c, $i);
        }
    }

    if ($attachments)
    {
        switch (trim(strtoupper($output)))
        {
            case ARRAY_A:
                $buf = array();
                foreach ($attachments as $id => $attachment)
                {
                    $buf[$id] = get_object_vars($attachment);
                }
                break;

            case ARRAY_N:
                $buf = array();
                foreach ($attachments as $id => $attachment)
                {
                    $buf[$id] = array_values(get_object_vars($attachment));
                }
                break;

            case OBJECT:
            default:
                $buf = $attachments;
                break;
        }

        if (!$preserve_keys)
        {
            $buf = array_merge(array(), $buf);
        }
    }

    return apply_filters('get_images', $buf);
}

 

Affichage des thumbnails à mettre dans votre code php dans la boucle wordpress pour que vos images soient bien celles de votre article (ID)

<?php
$img = get_post_images();
if ($img != false) {
   <div class="votre classe">
      <?php $nombre =rand(0,count($img)-1) ?>
      <img src="<?php echo wp_get_attachment_thumb_url($img[$nombre]->ID); ?>"/>
   </div>
  <?php
  }
?>

[PHP] Les conditions sur wordpress

Voici un liste des conditions principales sur WordPress.

  1. Liste principale
  2. Gestion des articles
  3. Gestion des pages
  4. Gestion des catégories
  5. Gestion des auteurs
  6. Gestion des tags
  7. Gestion des taxonomie (catégories, tags …)
  8. Gestion des termes
  9. Gestion des archives
  10. Gestion des excerpts
  11. Gestion des utilisateurs
  12. Gestion des dates
  13. Autres fonction (404, in the loop, image attachée, sous page, …)

 

Liste simple (de base)

<?php if (is_home()) { ?>
<!-- Lorsqu'on est sur la page principale du site. -->
<VotreTexte>
<?php } elseif (is_front_page()) { ?>
<!-- Lorsqu'on est sur la front page du site. -->
<VotreTexte>
<?php } elseif (is_front_page() && is_home()) { ?>
<!-- Lorsqu'on est sur la page du blog. -->
<VotreTexte>
<?php } elseif (is_singular()) { ?>
<!-- Lorsqu'on est sur n'importe quel page, article ou documents joints avec ces pages -->
<VotreTexte>
<?php } elseif (is_single('17')) { ?>
<!-- Lorsqu'on est sur le post numéro 17 (ou ayant le titre 17 ou ayant pour nom 17). -->
<VotreTexte>
<?php } elseif (is_page('42')) { ?>
<!-- Lorsqu'on est sur la page 42. (ou ayant le titre 42 ou ayant pour nom 42). -->
<VotreTexte>
<?php } elseif (is_archive()) { ?>
<!-- Lorsqu'on est sur n'importe quel page d'archive (categorie, tag, taxonomie etc...). -->
<VotreTexte>
<?php } elseif (is_search()) { ?>
<!-- Lorsqu'on est sur une page de recherche. -->
<VotreTexte>
<?php } else { ?>
<VotreTexte>
<?php } ?>

 

Pour la gestion des  « Articles »

<?php 
// Lorsqu'on est sur n'importe quel post. 
elseif (is_single()) { ?>
<Votre Texte>
<?php } ?>

<?php 
// Lorsqu'on est sur le post numéro 17 (ou ayant le titre 17 ou ayant pour nom 17).
elseif (is_single('17')) { ?>
<Votre Texte>
<?php } ?>

<?php
// Lorsqu'on est sur tout sauf sur le post numéro 17 (ou ayant le titre 17 ou ayant pour nom 17).
elseif (!is_single('17')) { ?>
<Votre Texte>
<?php } ?>

<?php 
// Lorsqu'on est sur le post ayant pour titre test (ou ayant pour nom test). 
elseif (is_single('test')) { ?>
<Votre Texte>
<?php } ?>

<?php 
// Lorsqu'on est sur le post ayant pour nom test2 (ou pour titre test2). 
elseif (is_single('test2')) { ?>
<Votre Texte>
<?php } ?>

<?php 
// Lorsqu'on est sur le post 17 ou sur le post ayant pour nom out titre test2 ou test.
elseif (is_single(array(17, 'test2', 'test'))) { ?>
<Votre Texte>
<?php } ?>

<?php 
// Lorsqu'on est sur le post 17,19,1 ou 11. 
elseif (is_single(array(17, 19, 1, 11))) { ?>
<Votre Texte>
<?php } ?>

<?php 
// Lorsque l'article concerné possède des thumbnails. 
elseif (has_post_thumbnail(7)) { ?>
<Votre Texte>
<?php } ?>

<!-- A NOTER : La fonction is single ne distingue pas la différence entre l'id, le titre du post et son nom. Un post nommée 17 sera déclenchée si l'on demande le post avec l'id 17, il en est de même pour le nom du post. Si on veut isoler L'Id, il faut juste mettre le nombre sans les ''. -->

 

Gestions des « Pages »

<?php 
// Lorsqu'on est sur n'importe quel page.
elseif (is_page()) { ?>
<Votre Texte>
<?php } ?>

<?php 
// Lorsque on est sur la page 42. (ou ayant le titre 42 ou ayant pour nom 42).
elseif (is_page('42')) { ?>
<Votre Texte>
<?php } ?>

<?php 
// Lorsque on n'est pas sur la page 42. (ou ayant le titre 42 ou ayant pour nom 42).
elseif (!is_page('42')) { ?>
<Votre Texte>
<?php } ?>

<?php 
// Lorsque on est sur la page qui a pour titre hello. (ou ayant pour nom hello). 
elseif (is_page('Hello')) { ?>
<Votre Texte>
<?php } ?>

<?php 
// Lorsque on est sur la page qui a pour nom hello2. (ou ayant pour titre hello2). 
elseif (is_page('Hello 2')) { ?>
<Votre Texte>
<?php } ?>

<?php 
// Lorsqu'on est sur la page 42 ou sur la page ayant pour nom ou titre Hello2 ou Hello.
elseif (is_page( array(42,'Hello2','Hello'))) { ?>
<Votre Texte>
<?php } ?>

<?php 
// Lorsque on est sur la page 42,54 ou 6.
elseif (is_page(array(42,54,6))) { ?>
<Votre Texte>
<?php } ?>

<?php
/* 
A NOTER : La fonction is page ne distingue pas la différence entre l'id, le titre du post et son nom. Une page nommée 17 sera déclenchée si l'on demande la page avec l'id 17, il en est de même pour le nom de la page. 
Si on veut isoler L'Id, il faut juste mettre le nombre sans les ''. 
*/
?>

 

Gestions des « Catégories »

<?php 
// Lorsqu'on est sur la page de la catégorie 9.
elseif (is_category('9')) { ?>
<Votre Texte>
<?php } ?>

<?php 
// Lorsqu'on est pas sur la catégorie 9.
elseif (!is_category('9')) { ?>
<Votre Texte>
<?php } ?>

<?php 
// Lorsque on est sur la page de la catégorie ayant pour nom test (ou ayant pour slug test).
elseif (is_category('test')) { ?>
<Votre Texte>
<?php } ?>

<?php 
// Lorsque on est sur la page qui a pour slug hello. (ou ayant pour titre hello). 
elseif (is_category('Hello')) { ?>
<Votre Texte>
<?php } ?>

<?php 
// Lorsque on est sur la page de la catégorie 9 ou qui a pour nom ou slug hello ou hello 2. 
elseif (is_category(array(9,'hello','Hello 2'))) { ?>
<Votre Texte>
<?php } ?>

<?php 
// Lorsqu'on est sur la catégorie 5 ou si la catégorie est une sous catégorie de la catégorie 5.
elseif (is_category(5) || cat_is_ancestor_of(5, get_query_var ('cat'))) { ?>
<Votre Texte>
<?php } ?>

<?php 
// Lorsque qu'un article appartient à la categorie 5.
elseif (in_category('5')) { ?>
<Votre Texte>
<?php } ?>

<?php 
// Lorsque qu'un article appartient à la categorie 1,2 ou 3.
elseif (in_category(array(1,2,3))) { ?>
<Votre Texte>
<?php } ?>

<?php 
// Lorsque qu'un article n'appartient pas à la categorie 1,2 ou 3.
elseif (!in_category(array(1,2,3))) { ?>
<Votre Texte>
<?php } ?>

<?php
/* 
A NOTER : La fonction is_category ne distingue pas la différence entre l'id, le titre du post et son slug. Une catégorie nommée 17 sera déclenchée si l'on demande la catégorie avec l'id 17, il en est de même pour le slug de la catégorie. 
Si on veut isoler L'Id, il faut juste mettre le nombre sans les ''.
Attention à ne pas confondre in_category et is_category.
*/
?>

Gestion des status

<?php
if ( get_post_status ( $ID ) == 'private' ) {
echo 'privé'; // Lorsque la page est privée.
} else {
echo 'publique'; // lorsque la page est publique
}
?>

Gestion « publié » ou « brouillon »

<?php 
if ( get_post_status ( $ID ) == 'publish' ) { 
echo 'publié'; // Lorsque la page est publiée. 
} else { 
echo 'Bourillon'; // lorsque la page est à l'état de brouillon
} ?>

Gestion des « Auteurs »

<?php 
// Lorsque qu'on est sur page d'archive faite par un auteur.
elseif (is_author()) { ?>
<Votre Texte>
<?php } ?>

<?php 
// Lorsque qu'on est sur une page d'archive faite par l'auteur 4.
elseif (is_author('4')) { ?>
<Votre Texte>
<?php } ?>

<?php 
// Lorsque qu'on est sur une page d'archive qui n'a pas été faite par l'auteur 4.
elseif (!is_author('4')) { ?>
<Votre Texte>
<?php } ?>

<?php 
// Lorsque qu'on est sur une page d'archive faite par l'auteur Alexandre (ou ayant pour surnom Alexandre).
elseif (is_author('Alexandre')) { ?>
<Votre Texte>
<?php } ?>

<?php 
// Lorsque qu'on est sur une page d'archive faite par l'auteur 4 ou par l'auteur Alexandre (ou ayant pour surnom Alexandre).
elseif (is_author(array(4,'Alexandre'))) { ?>
<Votre Texte>
<?php } ?>

<?php 
// Lorsque qu'on est sur une page d'archive faite par plusieurs personnes.
elseif (is_multi_author()) { ?>
<Votre Texte>
<?php } ?>

<?php
/* 
A NOTER : La fonction is_author ne marche que pour les pages d'archives. et La fonction ne distingue pas la différence entre l'id, le nom de l'auteur ou son surnom. Un auteur nommée 17 sera déclenchée si l'on demande l'auteur avec l'id 17, il en est de même pour le surnom de l'auteur. 
Si on veut isoler L'Id, il faut juste mettre le nombre sans les ''.
*/
?>

 

Gestions des « Tags »

<?php 
// Lorsqu'on est sur n'importe quel page de tag.
elseif (is_tag()) { ?>
<Votre Texte>
<?php } ?>

<?php 
// Lorsqu'on est sur la page de tag ayant pour slug hello.
elseif (!is_tag('hello')) { ?>
<Votre Texte>
<?php } ?>

<?php 
// Lorsqu'on n'est pas sur la page de tag ayant pour slug hello.
elseif (!is_tag('hello')) { ?>
<Votre Texte>
<?php } ?>

<?php
// Lorsque qu'on est sur la page de tag ayant pour slug hello, hello2 ou hello3.
elseif (!is_tag(array('hello','hello2','hello3'))) { ?>
<Votre Texte>
<?php } ?>

<?php
// Lorsque que le post a un tag (à utiliser dans la boucle).
elseif (has_tag()) { ?>
<Votre Texte>
<?php } ?>

<?php
// Lorsque que le post n'a pas de tag (à utiliser dans la boucle).
elseif (!has_tag()) { ?>
<Votre Texte>
<?php } ?>

<?php
// Lorsque le post actuel à le tag hello.
elseif (has_tag('hello')) { ?>
<Votre Texte>
<?php } ?>

<?php
// Lorsque le post actuel à le tag hello ou hello2 ou hello3.
elseif (has_tag(array('hello','hello2','hello3'))) { ?>
<Votre Texte>
<?php } ?>


<?php
/* 
A NOTER : Attention à ne pas confondre is_tag et has_tag. 
*/
?>

 

Gestion des « Taxonomies »

<?php
// Lorsqu'on est sur n'importe quelle taxonomy de page. 
elseif (is_tax()) { ?>
<Votre Texte>
<?php } ?>

<?php
// Lorsqu'on sur n'importe quelle page pour la taxonomy 'flavor'.
elseif (is_tax('flavor')) { ?>
<Votre Texte>
<?php } ?>

<?php
// Lorsqu'on sur n'importe quelle page pour la taxonomy 'flavor' avec le slug hello.
elseif (is_tax('flavor', 'hello')) { ?>
<Votre Texte>
<?php } ?>

<?php
// Lorsqu'on sur n'importe quelle page pour la taxonomy 'flavor' avec le slug hello,hello2 ou hello3.
elseif (is_tax('flavor', array('hello','hello2','hello3'))) { ?>
<Votre Texte>
<?php } ?>

<?php
// Lorsque la taxonomie hello existe.
elseif (is_taxonomy_exists('hello')) { ?>
<Votre Texte>
<?php } ?>

<?php
// Lorsque la taxonomie hello est hiérarchique.
elseif (is_taxonomy_hierarchical('hello')) { ?>
<Votre Texte>
<?php } ?>

 

Gestion des « Termes »

<?php 
// Lorsque le post actuel à un terme.
elseif (has_term()) { ?>
<Votre Texte>
<?php } ?>

<?php 
// Lorsque le post actuel à le terme vert pour la taxonomie 'couleur'.
elseif (has_term('vert', 'couleur')) { ?>
<Votre Texte>
<?php } ?>

<?php 
// Lorsque le post actuel à le terme vert,bleu ou rouge pour la taxonomie 'couleur'.
elseif (has_term(array( 'vert','bleu','rouge'), 'couleur')) { ?>
<Votre Texte>
<?php } ?>

<?php 
// Lorsque le post actuel à le terme vert,bleu ou rouge pour la taxonomie 'couleur'.
elseif (term_exists(array( 'vert','bleu','rouge'), 'couleur')) { ?>
<Votre Texte>
<?php } ?>

 

Gestion des « Archives »

<?php 
// Lorsque l'on est sur n'importe quel archive de post.
elseif (is_post_type_archive()) { ?>
<Votre Texte>
<?php } ?>

<?php 
// Lorsque si l'archive d'un post contient Bonjour, Hello, Bye.
elseif (is_post_type_archive( array( 'Bonjour', 'Hello', 'Bye'))) { ?>
<Votre Texte>
<?php } ?>

 

Gestion de l’ « Excerpt »

<?php 
// Lorsque le post actuel à un excerpt.
elseif (has_excerpt()) { ?>
<Votre Texte>
<?php } ?>

<?php 
// Lorsque le post 42 à un excerpt.
elseif (has_excerpt(42)) { ?>
<Votre Texte>
<?php } ?>

 

Gestion des « Utilisateurs »

<?php 
// Lorsque l'utilisateur est un admin.
elseif (is_super_admin()) { ?>
<Votre Texte>
<?php } ?>

<?php 
// Lorsqu'un utilisateur est connecté.
elseif (is_user_logged_in()) { ?>
<Votre Texte>
<?php } ?>

<?php 
// Lorsque l'utilisateur 'Alexandre existe sur le site.
elseif (username_exists('Alexandre')) { ?>
<Votre Texte>
<?php } ?>

<?php 
// Lorsque l'email suivant a été attribuée à un utilisateur.
elseif (email_exists('Alexandre@gmail.com')) { ?>
<Votre Texte>
<?php } ?>

 

Gestion des « Dates »

<?php 
// Lorsqu'on est sur une page avec la date indiquée.
elseif (is_date()) { ?>
<Votre Texte>
<?php } ?>

<?php 
// Lorsqu'on est sur une page avec l'année indiquée.
elseif (is_year()) { ?>
<Votre Texte>
<?php } ?>

<?php 
// Lorsqu'on est sur une page avec le mois indiquée.
elseif (is_month()) { ?>
<Votre Texte>
<?php } ?>

<?php 
// Lorsqu'on est sur une page avec postée aujourd'hui.
elseif (is_day()) { ?>
<Votre Texte>
<?php } ?>

<?php 
// Lorsqu'on est sur une page postée il y'a une heure.
elseif (is_time()) { ?>
<Votre Texte>
<?php } ?>

<?php 
// Lorsqu'on est sur une page considérée comme un "jour nouveau" par rapport à la date de publication.
elseif (is_new_day()) { ?>
<Votre Texte>
<?php } ?>

Autres

<?php 
// Lorsque le type d'article book a été enregistré comme étant "supporté par la hiérarchie".
elseif (is_post_type_hierarchical('book')) { ?>
<Votre Texte>
<?php } ?>

<?php 
// Lorsqu'on est sur une page d'erreur 404.
elseif (is_404()) { ?>
<Votre Texte>
<?php } ?>

<?php 
// Lorsqu'on est dans la boucle.
elseif (in_the_loop()) { ?>
<Votre Texte>
<?php } ?>

<?php 
// Si il y'a une page sur le site.
elseif (post_type_exists('page')) { ?>
<Votre Texte>
<?php } ?>

<?php 
// Lorsqu'on est sur une page qui est une sous page d'une autre page.
elseif (is_paged()) { ?>
<Votre Texte>
<?php } ?>

<?php 
// Lorsqu'on est sur une image ou un fichier que l'on a joint à une page.
elseif (is_attachment()) { ?>
<Votre Texte>
<?php } ?>

<?php 
// Lorsqu'on est sur une image jointe qui a l'id 4.
elseif (wp_attachment_is_image(4)) { ?>
<Votre Texte>
<?php } ?>

<?php 
// Lorsqu'on est sur une page d'un plugin.
elseif (is_plugin_page()) { ?>
<Votre Texte>
<?php } ?>

<?php 
// Lorsqu'on est sur un theme enfant.
elseif (is_child_theme()) { ?>
<Votre Texte>
<?php } ?>

 

 

 

[CSS + PHP] Background images random parmi une liste

Besoin d’insérer une image aléatoire sur votre « header » ou ailleurs, ces petites lignes de codes vont vous y aider. Contrairement à d’autres codes qui mettrons une image aléatoire qui risque de se répéter, cet outil assure que toutes les images de votre choix (tableau) seront affichées les unes après les autres … mais toujours au hasard.

Dans votre CSS

.image1 {background-image: url(img/fond1.jpg);}
.image2 {background-image: url(img/fond2.jpg);}
.image2 {background-image: url(img/fond3.jpg);}
.image2 {background-image: url(img/fond4.jpg);}
.etc {background-image: url(img/fond5.jpg);}

Dans votre page PHP

<?php session_start(); ?>
<div class=" <?php
   $images = array("image1", "image2", "image3", "image4", "etc");
 $nombre = rand(0,count($images)-1);
 if (isset($_SESSION['numero'])){
 while ($_SESSION['numero'] == $nombre || $_SESSION['numero2'] == $nombre) {
 $nombre = rand(0,count($images)-1);
 }
 $_SESSION['numero2'] = $_SESSION['numero'];
 $_SESSION['numero'] = $nombre;
 echo $images[$nombre] . "\n";
 } else {
 $_SESSION['numero2'] = $_SESSION['numero'];
 $_SESSION['numero'] = $nombre;
 echo $images[$nombre] . "\n";
}
?>">
</div>

[functions + PHP] Afficher tous les thumbnails d’un article sur wordpress

Il y a des projets qui nécessitent l’affichage de toutes les images sous forme de thumnails dans votre page archive.php ou ailleurs.La plupart du temps nous n’avons besoin que de l’image à la une avec l’excerpt de wordpress mais cet excerptne permet pas l’affichage des images.

Ce « petit » morceau de code (que nous vous conseillons de placer dans un autre fichier que functions.php à l’aide d’un « include ») vous aidera comme il se doit à afficher les images où et comme vous le souhaitez.

 

Dans le fichier functions.php avec ou sans « include » :

/** récupération des thumbnails **/ <?php
function get_post_images($args = array())
{
    global $post;

    $defaults = array(
        'number'        => -1,
        'order'         => 'ASC',
        'orderby'       => 'post_date',
        'output'        => OBJECT,
        'post_id'       => null,
        'preserve_keys' => false
    );
    $args = wp_parse_args($args, $defaults);

    $post_id = (int) $args['post_id'];
    if (0 === $post_id)
    {
        if (!in_the_loop())
        {
            return false;
        }

        $post_id = $post->ID;
    }
    extract($args, EXTR_SKIP);
    $attachments = false;
    $buf         = false;
    $number      = (int) $number;
    $number      = (0 === $number) ? -1 : $number;

    $order = strtoupper(trim($order));
    if ('ASC' !== $order && 'DESC' !== $order)
    {
        $order = 'ASC';
    }

    switch (strtolower(trim($orderby)))
    {
        case 'natural':
            $orderby = 'natural';
            break;
        case 'post_id':
            $orderby = 'ID';
            break;
        case 'post_date':
        default:
            $orderby = 'post_date_gmt';
            break;
    }

    if ('natural' !== $orderby)
    {
        $attachments = get_children(array(
            'order'          => $order,
            'orderby'        => $orderby,
            'numberposts'    => $number,
            'post_mime_type' => 'image',
            'post_parent'    => (int) $post_id,
            'post_status'    => 'inherit',
            'post_type'      => 'attachment'
        ));
    }

    if (!$attachments)
    {
        if ($post_id == $post->ID)
        {
            $post_content = $post->post_content;
        }
        else
        {
            $my_post = get_post($post_id);
            if (!$my_post)
            {
                return false;
            }
            $post_content = $my_post->post_content;
            unset($my_post);
        }

        $regexp = apply_filters('get_images_regexp', '#<\s*?img\s+.*?wp-image-(\d+)[^>]*>#i');
        if (1 === $number)
        {
            preg_match($regexp, $post_content, $matches);
            if (isset($matches[1]))
            {
                $matches = array($matches[1]);
            }
        }
        else
        {
            preg_match_all($regexp, $post_content, $matches);
            if (isset($matches[1]))
            {
                $matches = $matches[1];
            }
        }
        unset($regexp, $post_content);

        if ($matches_count = count($matches))
        {
            $stack = array();
            if (-1 === $number)
            {
                $c = $matches_count;
            }
            else if ($number < $matches_count)
            {
                $c = $number;
            }
            else
            {
                $c = $matches_count;
            }
            unset($matches_count, $number);

            for ($i = 0; $c > $i; ++$i)
            {
                $id = (int) $matches[$i];
                $stack[$id] = get_post($id);
            }

            if ('natural' === $orderby)
            {
                $attachments = $stack;
            }
            else
            {
                $tmp = array();
                foreach ($stack as $id => $attachment)
                {
                    $tmp[$id] = $attachment->$orderby;
                }
                natcasesort($tmp);

                foreach (array_keys($tmp) as $id)
                {
                    $attachments[$id] = $stack[$id];
                }
                unset($tmp, $attachment);

                if ('DESC' === $order)
                {
                    $attachments = array_reverse($attachments, true);
                }
            }
            unset($stack, $id, $c, $i);
        }
    }

    if ($attachments)
    {
        switch (trim(strtoupper($output)))
        {
            case ARRAY_A:
                $buf = array();
                foreach ($attachments as $id => $attachment)
                {
                    $buf[$id] = get_object_vars($attachment);
                }
                break;

            case ARRAY_N:
                $buf = array();
                foreach ($attachments as $id => $attachment)
                {
                    $buf[$id] = array_values(get_object_vars($attachment));
                }
                break;

            case OBJECT:
            default:
                $buf = $attachments;
                break;
        }

        if (!$preserve_keys)
        {
            $buf = array_merge(array(), $buf);
        }
    }

    return apply_filters('get_images', $buf);
}

 

Affichage des thumbnails à mettre dans votre code php dans la boucle wordpress pour que vos images soient bien celles de votre article (ID)

<?php
$img = get_post_images();
if ($img != false) {
   for ($i = 0; $i < count($img); $i++) { ?>
      <div class="votre classe">
            <img src="<?php echo wp_get_attachment_thumb_url($img[$i]->ID); ?>"/>
        </div>
<?php
    }
}
?>

 

Exemple : Afficher les images dans un carroussel (Bulma) avec Fancybox

<div id="carousel-accueil" class="carousel overflow">
    <?php $img = get_post_images();
    if ($img != false) {
        for ($i = 0; $i < count($img); $i++) { ?>
            <div class="section-lot-slider">
                <a class="fancybox" rel="images<?php echo $numeroarticle; ?>" href="<?php echo wp_get_attachment_url($img[$i]->ID, 'large'); ?>">
               <img src="<?php echo wp_get_attachment_thumb_url($img[$i]->ID); ?>" />
               </a>            
            </div>    
    <?php }    
    } ?> 
</div>

[PHP] Ajouter un champs customisé sur WordPress

champ personnalisé wordpress

Utile pour faire apparaitre des images, du texte, une vidéo … bref un peu tout où vous le voulez dans votre html.

Ne pas oublier de remplir les « champs personnalisés ».

<?php echo get_post_meta($post->ID, 'NOM DE VOTRE VARIABLE', true); ?>

[wp-config.php] Compresser automatiquement les images JPG sur wordpress

Un petit « hack » bien utile. Certes, wordpress propose déjà une compression de 10%. Mais cette compression n’est pas suffisante pour alléger votre page. Nous préconisons le 60%.

Mais cette valeur peut changer selon vos besoins. N’hésitez pas à tester la compression en utilisant le compresseur en ligne Squoosh.

Cette fonction peut s’utiliser avec celle-ci qui supprime les images trop grandes afin de ne pas encombrer votre FTP.

Dans votre fichier config.php

// Compresser les images JPEG de WordPress.

add_filter('jpeg_quality', function($arg){return 60;}); // Une valeur de 60 va compresser l'image a 60% (les valeurs vont de 0 à 100, vous pouvez changer les valeurs - sur les deux lignes).
add_filter( 'wp_editor_set_quality', function($arg){return 60;} );

[functions] Supprimer automatiquement les images trop grandes sur worpdress

La pratique nous a démontré que nos clients uploadaient leurs images sans les renommer (voir ici le « hack » pour arranger un peu la situation) et sans les compresser. Il n’est pas rare que l’utilisateur uploade directement les images à la sortie de leur smartphone ou de leur appareil photo. Les images sont toujours disproportionnées face au besoin du web (300ppp et plusieurs méga contre un 72ppp et quelques centaines de kilos pour la norme web).

En définitive vous obtenez un FTP surchargé par des images inutilement trop grandes et trop lourdes.

Ce « hack », facile, permet d’effacer les images dépassant les dimensions de votre « grande taille » dans le fichier setting/medias/ de wordpress

// Remplacer l'image originale trop grande
function replace_uploaded_image($image_data) {
if (!isset($image_data['sizes']['large'])) return $image_data;

$upload_dir = wp_upload_dir();
$uploaded_image_location = $upload_dir['basedir'] . '/' .$image_data['file'];
$large_image_filename = $image_data['sizes']['large']['file'];

$image_basename = wp_basename($uploaded_image_location);
$large_image_location = str_replace($image_basename, $large_image_filename, $uploaded_image_location);

// suppression de l'image trop grande
unlink($uploaded_image_location);

// renommer l'image de grante taille
rename($large_image_location, $uploaded_image_location);

// update image
$image_data['width'] = $image_data['sizes']['large']['width'];
$image_data['height'] = $image_data['sizes']['large']['height'];
unset($image_data['sizes']['large']);

// Check
foreach($image_data['sizes'] as $size => $sizeData) {
if ($sizeData['file'] === $large_image_filename)
unset($image_data['sizes'][$size]);
}

return $image_data;
}
add_filter('wp_generate_attachment_metadata', 'replace_uploaded_image');

[PHP] Renommer les images automatiquement sur wordpress

Nous avons remarqué que nos clients uploadaient leurs images sans les renommer, telles qu’elles sont enregistrées par leur smartphone ou leur appareil photos.

Ce code permet de sélectionner un mot clé pour renommer automatiquement les photos uploadées. Le code permet aussi, de compter les images présentes dans les dossiers mensuels Upload de wordpress, afin que les photos qui ont toutes le même nom, aient un préfixe numérique différent : ex : votre-mot-cle-05.jpg

L’avantage de ce code est qu’il permet de ne pas perdre un bonne occasion de se « référencer » sur des mots clés dans Google image. Certes cela reste du « bidouillage », à nos yeux de professionnel, parce qu’ il est tellement mieux de nommer ses photos intelligemment en fonction de ce qu’elles représentent ou en appuyant sur les différents mots clés que vous avez choisi. Mais l’expérience nous montre que nos clients ne le font pas toujours. Peut être que les vôtres non plus !

Code à placer dans le fichier functions.php de votre thème (ligne 48 : changer ‘VOTRE-MOT-CLE’ par … votre mot clé !)

// Compte le nombre d'images du répertoire où sont stockées les images médias ou bien crée le dossier s'il est inexistant.

function count_images_url_file() {
    $uploads = wp_upload_dir();
    $repertoire = $uploads['path']; // On récupère notre répertoire.
    if (is_dir($repertoire)) { // On regarde s'il existe.
        if ($dh = opendir($repertoire)) {  // Si c'est le cas on le lit.
            while (($file = readdir($dh)) !== false) {
                if ($file != "." && $file != ".." ) {
                $filelist[]= $file;
            }
            }
            closedir($dh);
        }
        return count($filelist); // Et on retourne le nombre d'images présentes à l'intérieur.
    } else {
        mkdir ($repertoire); // Si le dossier n'existe pas on le crée et on retourne 0 car il ne comporte pas d'images.
        return 0;
    }
}
  
// Mise à jour du NOM de l'image lors de l'importation.
 
function change_nom_mot_cle_dur ( $filename, $prefixe) {
   $info = pathinfo( $filename ); // Analyse de notre fichier.
   $ext = empty( $info['extension'] ) ? '' : '.' . $info['extension']; // On récupère l'extension de notre fichier.
   if (function_exists('count_images_url_file')) {
       $nombre_fichier =(count_images_url_file())+1; // On récupère le nombre d'images de notre répertoire.
   } else {
       $nombre_fichier = 1; // Cas ou la fonction n'est pas trouvé.
   }
   $nom = $prefixe.$nombre_fichier; // On prépare le nom du fichier sortant.
   return $nom . $ext; // Et on le retourne avec son extension.
}
  
// Mise à jour du TITRE de l'image.
 
function change_titre_mot_cle_dur ( $image_ID, $nom ) {
$image = array ( // On modifie le titre dans cette variable.
   'ID' => $image_ID,
   'post_title' => $nom
);
   wp_update_post( $image );
}
  
// Choix du mot clé :
 
$mot_clé = 'VOTRE-MOT-CLE'; // Évitez les caractères spéciaux ("?", ":", "/", "!" etc...).
  
// Appel des deux fonctions.
 
add_filter( 'sanitize_file_name', function( $filename ) use ( $mot_clé ) {
    return change_nom_mot_cle_dur ( $filename, $mot_clé );
},1 );
 
add_action( 'add_attachment', function( $image_ID ) use ( $mot_clé ) {
    change_titre_mot_cle_dur ( $image_ID, $mot_clé );
},10);
 
do_action ( 'add_attachment');

 

Code réalisé par Valentin B. pour emandarine (2019)

[PHP] Afficher du code en fonction de la catégorie dans WordPress

Nous avons souvent besoin d’intégrer des spécificités (HTML, JS, PHP ou autre code) lors de l’affichage d’articles pour certaines catégories.

Dans votre page PHP pour une catégorie :

<?php if (in_category(1) ) { ?>     <!-- description --> 
  Votre code
<?php } elseif (in_category(2) ) { ?>     <!-- description--> 
  Votre code
<?php } else { ?>     <!-- Pour tout le reste --> 
  Votre code
<?php } ?>

Pour plusieurs catégories :

<?php if (in_category( array( 5,6,7,8,9,10 ))) { ?>
Votre code

<?php } else if ( is_page(array( 500, 506, 508, 510 )) ) { ?>
Votre code

<?php } else { ?>
Votre code
<?php } ?>

 

[PHP] Publier une image dans le thème de WordPress

Alors, c’est vrai, ce n’est pas franchement un « hack », il s’agit juste d’un pense bête à l’usage des distraits.

<?php echo get_template_directory_uri(); ?>/css/img/VOTRE-IMAGE.JPG"  ?>

On oublie trop souvent que WordPress est un CMS et que le chemin vers votre images doit passer par le thème actuel : TEMPLATE DIRECTORI URI.

Il n’est pas rare de voir des débutants sur Worpdress chercher pendant plusieurs minutes pourquoi leurs images ne s’affichent pas.

 <figure>
<a href="<?php the_permalink() ?>" title="<?php the_title(); ?>">
<!-- ou selon besoin  <a href="<?php echo home_url(); ?>" title="<?php bloginfo(); ?>"> -->
<img src="<?php echo get_template_directory_uri(); ?>/css/img/VOTRE-IMAGE.JPG" alt="<?php the_title();  ?>">
</a>
</figure>

Tester son logo

logolab

 

Logo Lab est un outil très efficace qui vous propose de tester votre logo dans plusieurs situations (scalabilité, silhouette, balance et accessibilité).

Spirographe virtuel

spirographe

L’inspirograph vous rappellera quelques souvenirs d’enfance. Il ne sert pas vraiment à grand chose d’autre d’autre… A la rigueur, il peut favoriser fortement la procrastination. Qu’importe !

L’outil vous permet d’importer votre œuvre, vous pouvez agir sur les couleurs, les formes, avec la souri ou le clavier.

Amusez-vous bien !

30 outils indispensables pour un Webdesigner

Il existe pléthore de sites web offrants des outils utiles aux Webdesigners. Nous vous en avons sélectionné quelques-uns qui pourraient bien vous devenir indispensables !

Trouver des images

Où trouver des images libres de droit ?

Banques d’images

Voici 4 sites – parmi les nombreux disponibles sur la toile – sur lesquels vous allez pouvoir dénicher la photo parfaite :

Générateurs d’images

Et si vous avez simplement besoin d’une image quelconque mais d’une résolution précise (en attendant d’avoir l’image définitive par exemple), appuyez-vous sur des générateurs d’images comme Lorem Pixel ou LoremFlickr. Sinon, optez pour les motifs disponibles sur PatternCooler.

capture-ecran-pixabaycapture-ecran-pattern-cooler

Générer des favicons

Comment générer facilement et rapidement des favicons ?

Générateurs de favicons

Les favicons sont des icônes représentatives d’un site web (elles apparaissent notamment à côté du nom de l’onglet). La dernière version de WordPress permet d’en créer une facilement (voir dans personnalisation/identité du site/icône du site) mais vous pouvez avoir besoin d’autres formats, pour des tuiles au format de Windows 10 par exemple. Dans ce cas, plusieurs sites web peuvent vous intéresser :

Dessiner sa favicon

Deux autres sites permettent de créer sa favicon en la dessinant :

La création se fait en ligne, sans avoir a créer de compte, à partir d’une image que vous aurez choisie sur votre ordinateur.

Créer une favicon n’est certes pas obligatoire mais elle permet de mieux se rappeler de votre site, elle fait partie de son identité visuelle. Pensez-y !

capture-ecran-onglets capture-ecran-icone-generator

Alléger des images

Comment alléger drastiquement des images (jpg, png… et même svg) afin de limiter leur temps de téléchargement ?

Faites appel au Kraken ! Cet optimiseur d’image vous permet de diminuer le poids de votre site en s’attaquant aux images qui se font attendre et même – dans sa version payante – de les redimensionner.

capture-ecran-kraken

Générer du code CSS

Comment générer du code CSS en toute simplicité ?

Plusieurs sites vous permettent de paramétrer un élément (une boite, une flèche, etc.) et d’en générer le code en vue de l’intégrer au sein de votre site web :

capture-ecran-css3-generator capture-ecran-css-arrow-please

Modeler le texte

Comment se rendre compte du rendu d’un texte et de la taille qu’il prendra au sein de votre site ?

Générateurs de texte

Utilisez un générateur de texte Lorem Ipsum, qui créera du texte provisoire :

capture-ecran-lorem-ipsum

Générateurs de code

Appuyez-vous sur des générateurs de code :

Polices de caractères

Appliquez-vous sur les polices :

  • Typetester pour comparer des polices
  • Font Pair pour associer 2 polices qui vont ensemble
  • What Font Is pour trouver l’équivalent d’une police libre de droit

capture-ecran-fontpair

Animer son site

Comment animer son site ?

Le temps que l’une des pages de votre site se charge, vous pouvez utiliser une animation :

Et si vous voulez simuler un fond étoilé animé, il existe même une solution ! Optez pour Parallax Star background in CSS.

capture-ecran-wait-animate capture-ecran-parallax

Fouillez le net à la recherche d’outils qui vous feront gagner du temps, vous n’avez pas fini d’en trouver !

Flapit : le compteur de fans en temps réel

flapit
Flapit est un compteur de fan en temps réel. Amusant plus qu’utile, encore que !
Ce petit outil que vous placerez en vitrine ou sur votre comptoir permettra à vos clients de connaitre le nombre de « followers », de « fans » ou d’avis Yelp! L’autre avantage, celui de gagner d’autres « fans », juste pour le voir fonctionner en temps réel. L’outil fonctionne sur toutes les plateformes de réseaux sociaux.
Il vous faudra compter la modique somme de 574.80 €uros TTC (+ frais d’envoi) pour vous le procurer.
La notoriété sur le web a son prix !

Évolution des taux de clics

L’agence Synodiance vient de mettre en ligne une infographie suivie d’une étude (SEO) très intéressante sur l’évolution du taux de clics sur les résultats de recherche du moteur de recherche Google.

evolution-taux-clic-seo-référencement-étude

Infographie webmarketing 2015

A voir, pour les fans d’images, mais aussi pour les webmarketeur en veille (entres autres) une page « hashtag » Facebook plutôt intéressante. C’est si rare que cela méritait d’être dit : #infographie

Cette page, comme son nom l’indique regroupe toutes les infographies diffusée sur Facebook grace au fameux « hashtag ». Il y en a pour tout le monde et dans ces conditions, il est facile de trouver son bonheur.

Voici quelques infographies qui ont retenue notre attention.

 

Baromètre Consommateur : les Français vivent sur Internet

Sources : www.thinkwithgoogle.com/intl/fr-fr/infographic/barometre-consommateur-les-francais-vivent-sur-internet/
les Français vivent sur Internet2

 

Etat des lieux du marketing mobile et du m-commerce en France

Sources : comarketing-news.fr/etat-des-lieux-du-marketing-mobile-et-du-mcommerce-en-france/

infographie-mobile-marketing-france

 

Alphabet SEO

Sources : www.redsquareseo.net/blog/2015/07/09/infographic-seo-alphabet/
alphabet-seo

 

 

Comprendre pourquoi un contenu de marque fonctionne ou non.

http://www.insightsinmarketing.com/resources/blog/seven-musts-of-creating-trustworthy-content/

content marketing

 

Comment utiliser les média sociaux dans les petites entreprises.

Sources : sproutsocial.com/insights/social-media-for-small-business/

media sociaux dans les petites entreprises

 

 

Et comme nous vous le disions plus haut. Vous trouverez d’autres infographie sur la page « #infographie » de Facebook.

Haro sur les selfies

Nul besoin de présenter les selfies : On le sait, le selfie est un phénomène de mode fortement encouragé par les réseaux sociaux.

Il y n’a pas si longtemps, les objectifs et les appareils photo ne permettaient pas à l’auteur de se prendre lui même en photo… seules quelques astuces alambiquées et frisant parfois le ridicule l’autorisaient ! (voir photo)

selfie

 

Heureusement pour les égocentriques que nous sommes, les mobiles et leurs petites lentilles assortis de leur perche à selfie, nous offrent la joie de prouver qu’on est jamais aussi bien servi que par soi-même et que surtout… nous étions bien sur place le jour de la photo ! Nous l’avons bien compris, la photographie d’aujourd’hui ce n’est pas d’immortaliser un moment (en caméra subjective) mais bel est bien de se placer au centre de l’évènement.

Le phénomène devient tellement important que les médias recensent aujourd’hui une partie des dérapages occasionnés… Et ils sont nombreux; généralement ridicules, parfois navrants et quelques fois dangereux ou même mortels.

Oublions le ridicule (il y aurait trop à dire) et parlons des selfies navrant : Au Costa Rica, des tonnes de touristes sont venus voir pondre les tortues olivatres. Les quelques tortues qui ont eu le courage de les affronter ont dû parfois supporter des personnes sur leur dos le temps d’un selfie. Certains « amoureux de la nature » n’ont pas trouvé mieux que d’emporter un ou deux œufs en souvenir, la plupart des tortues sont finalement parties sans avoir pondu (voir la source).

selfie

Les Dangereux

Au Colorado, un canyon a été fermé à cause de l’imprudence des touristes.

selfie

« Nous avons pu constater que des gens utilisent des ‘selfie sticks’ pour essayer de se rapprocher le plus possible des ours, parfois à dix pieds [trois mètres, ndlr]. La situation est devenue ingérable, concernant la sécurité des visiteurs comme la tranquillité des animaux sauvages. »

 Les selfies mortels

12 morts recensés : percuté par un train ou tombant dans les escaliers du Taj Mahal en faisant un selfie.C’est déjà trop mais c’est surtout une mort ridicule. Est-ce la faute du selfie ? Il est aussi possible de mourir en mangeant des bretzels. Ce n’est pas pour autant que les bretzels sont mortels. Ce sont surtout les comportements qui sont à déplorer.

Pour finir

Rien de bien grave me direz-vous ! 12 morts, de bêtes accidents, c’est vrai !  il n’empêche qu’à force de se regarder dans le monde au travers de son téléphone on fini par ne plus voir le monde qui nous entoure. Et c’est parfois dommage !

Il n’empêche que le selfie fait couler plus d’encre virtuel que de sang.

Visioconférence online

conférence online gratuiteappear.in

conférence online gratuite appear.in

Attention : Article dénué de toute esprit critique [ndr]

Besoin occasionnel d’entrer en contact visuel avec quelqu’un sans pour autant vous compliquer la vie avec des paramètres d’installation compliqués… et cela gratuitement et sans rien installé ? En plus en toute sécurité ? appear.in est là pour vous !

Je sais, cela ressemble à une très mauvaise opération de publicité ! mais comment ne pas réagir autrement lorsqu’on utilise cet outil ? Avez vous essayé d’envoyer vos contact sur Hangout ou sur Skype. Il est parfois nécessaire de faire 1/2 de formation au préalable.

Appear.in propose de la visioconférence online de qualité, sans effort et cela sans contrepartie pécuniaire. Difficile de faire mieux ! Alors oui, lorsqu’un outil propose autant d’avantage, j’ai du mal à cacher ma joie.

appear.in est très simple d’utilisation : il vous suffit d’aller sur la page d’appear.in de choisir le nom de votre « Room » et d’envoyer l’adresse à vos contacts (jusqu’à 8 personnes connectées en même temps).

Bien tenté !

MovAvi est un petit logiciel de conversion de fichiers vidéo. Nous l’avons installé pour convertir un fichier en pensant que ce serait plus facile et plus rapide que sur Première Adobe. Mais l’offre « démo » nous imposait un petit texte mal venu sur notre vidéo. Le logiciel étant payant (l’enregistrement sur le site nous aurait fait trop perdre de temps), nous sommes donc retourné sur Première. Tant pis !

L’installation étant faite en version démo, nous avons décidé de supprimer le programme de notre ordinateur. Et voici ce que nous avons vu.movavi

Nous aimons bien l’idée commerciale (quand même un peu kitch) du petit chien triste posé sur un cousin en forme de cœur ! Nous apprécions également la promotion. De l’émotion, de l’humour et une offre conséquente de 40% sur le prix, voilà de quoi nous faire réfléchir ! Comme quoi tout ce négocie !

A vous de voir si Adobe peut vous faire la même offre et peut être vous tirer une petite larme !

2 Générateurs de favicons

Pour avoir fait à la « main » les favicons et les Icones Apple Touch, nous pouvons vous dire que c’est long … très long mais voici que ces deux générateurs arrivent pour vous faire gagner beaucoup de temps. En deux clics et quelques secondes et c’est fait … Faire plus simple aurait été difficile !

Le premier ne nécessite qu’un clic, un simple glisser/coller et un clic, celui du téléchargement de votre fichier zippé : Imogen. Il vous suffit de copier coller le code à insérer dans votre header (en vérifiant bien l’adresse des images, une fois que vous les aurez dézippé dans votre dossier).

Le deuxième : Iconifier, est aussi facile (un clic de plus cependant, pour importer votre image !).

générateur de favicon imogen

Kraken.io image lighter

S’il y a un point indispensable, pour l’instant, sur le web c’est bien d’alléger le poids de son site. Vous pouvez déjà commencer (ou continuer) par les images. Souvent trop lourdes et mal dimensionnées, elles ralentissent le temps d’affichage de votre site et ça ce n’est pas très bon ! Les moteurs de recherche peuvent vous pénaliser pour cela. Sans compter que vos visiteurs n’ont pas toujours la patience d’attendre que le site s’affiche.

Kraken est l’outil online idéal, même dans sa version gratuite qui ne permet que l’optimisation du poids de vos images. Et il aussi efficace que rapide ! Un simple glisser/coller d’un groupe d’images sur le site suffit. A savoir qu’en plus il agit sur le poids des SVG.

kraken

Un test de qualité a été fait autour de notre logo et il s’avère très concluant : 92.89 Kb sauver soit 82.42 % de gain et nous ne percevons pas de perte.comparer deux images

kraken1

La version pro de Kraken offre aussi la possibilité de redimensionner les images.

 

 

 

Arkvilé

Une vidéo virale pour de l’eau de source, Evian s’y était déjà aventuré avec succès. La vidéo a déjà fait presque 80 M de vues à ce jour sur Youtube. Mais c’était Evian ! La marque est ultra connu et s’exporte dans le monde entier.

Quel serait le résultat d’une vidéo virale pour une eau de source lituanienne que personne ici bas ne connait ? et bien c’est ce que nous allons prochainement savoir. Arkvilé une eau de source inconnu venant d’un pays (qui est difficile de placer précisément sur une carte) vient de mettre en ligne une vidéo qui a tous les atouts pour plaire : enfants et animaux sympas, le tout enrobé d’une bonne dose d’humour et de fraicheur, …

 

Google et partialité

Google fait un peu ce qu’il veut et nous impose les résultats qui l’arrangent le mieux, c’est maintenant une certitude ! Le fonctionnement et le succès de nombreux sites internet dépendent de leur positionnement dans les moteurs de recherche. Google occulte leur présence et ne procure plus aux utilisateurs une information pertinente au niveau local.

 

Focus on the user, une association de plusieurs « puissants » du web (Yelp! TripAdvisor …) ne compte pas se laisser faire et propose de télécharger un plugin qui vous permet de voir les résultats tels que vous les avez demandés.

« Si vous faites une recherche sur Google aujourd’hui, la plus grande partie de la page qui n’est pas consacrée aux publicités est dédiée aux résultats fournis seulement par Google + Local. Ce soit disant “map pack” combine les notes et avis de Google + sans prendre en considération le reste du Net. Si la carte (une information objective) ne pose pas de problème, les avis et notes (informations subjectives), contenu fourni exclusivement par Google+, sont eux plus critiquables. L’enquête de la Commission européenne est à mettre en relation avec ce problème. »

De toute évidence, l’ajout d’un plugin sur votre navigateur n’est pas la réponse. L’idéal serait que Google fasse impartialement ce pourquoi il est payé !

Source : http://focusontheuser.eu/fr

Tester l’accessibilité de votre site

test Accessibilité

test Accessibilité

L’accessibilité c’est rendre visible et audible un site internet à ceux qui n’ont pas les mêmes moyens physiques (mal-voyants, daltoniens, mal-entendants…) ou même à ceux qui n’ont pas les mêmes moyens matériels (vieil ordinateur, vieux navigateur, connexion très lente …). Chaque visiteur est un prospect ; rendre accessible son site favorise un meilleur taux de transformation.

En y regardant bien, de nombreux sites ne sont pas fait pour ce type de visiteurs. En effet, bien souvent, lorsqu’un site est mis en ligne, il est conçu selon ce que voit leurs concepteurs ; avec leur écran, leurs navigateurs, leur connexion… Un site n’est pas perçu de la même façons d’un individu à un autre.

Aussi, il existe des « normes » d’accessibilité. Tanaguru, met à votre disposition un outil de test pour mieux mettre en évidence les points faibles d’accessibilité. Gratuit pour 5 tests par jour.

Générateur de Mentions légales

Générateur de mentions légales

Générateur de mentions légales

Un outil bien pratique pour générer les mentions légales d’un site. Complètement gratuit, utile et très ergonomique.

Réalisation : Ursula Salembere pour emandarine.

Alternative à Google font

font adobe

font adobe

Pas toujours facile de chercher et de trouver une police sur Google font, il faut le reconnaitre. Adobe font pourrait être une alternative intéressante, d’abord parce qu’il y a du choix (A ce jour il y a déjà plus de 500 polices gratuites et disponibles sur le site) et aussi parce que l’interface facilite de beaucoup la recherche.

Il ne nous reste qu’à vérifier le temps de chargement de la police sur un site et voir si cela ne le ralenti pas trop, le problème est exactement le même avec les polices proposées par Google.

Le Mooc c’est Fun ?

france université numérique

Aujourd’hui 16 janvier 2014, date de l’ouverture du site français ( France Université Numérique) spécialisé dans le MOOC (massive open online cours). Le MOOC, en plus d’être très intéressant pour se former tout au long de la vie et cela gratuitement sans pour autant donnant droit à un diplôme, offre aussi l’avantage d’être un outil marketing efficace pour la promotion des universités.

MIT pour l’instant rafle tout les « oscars » avec son professeur ultra youtubé « Walter Lewin » qui n’hésite pas à faire des démonstrations étonnantes dans son amphi.

L’avenir nous dira si les universités françaises (gratuite pour l’instant) suivront voie et quel sera notre « Walter Lewin » à nous.

 

Color Emotion Guide

Je me suis permis de traduire cette très bonne infographie « the color emotion guide », qui nous explique la perception émotionnelle qu’engendre les logos en fonction de leur couleurs.

Certes, il est question d’une interprétation généraliste spécifique à notre culture occidentale. Coca Cola en rouge qui représente la jeunesse et l’excitation, WordPress qui vante, à travers le bleu, la confiance et la sécurité. Cela parait, avec le recul, tout à fait adéquat.

color emotion guide en français

Document original trouvé sur « the logo company« 

Générateurs en séries


C’est toujours pratique les générateurs de code CSS, nous en avons déjà maintes fois parlé. Nous ne nous lassons pas !

Css Matic, propose plus qu’un simple générateur de dégradé (comme ici) . Des dégradés verticaux ou horizontaux, radients ou linéaire, ou en diagonales et cela avec autant de couleurs que votre navigateur et votre bon goût pourront supporter. Ajoutez à ça (sur le même site) un générateur de radius, de box shadow et … également un générateur de texture. Sans compter qu’il génère aussi pas mal de gain de temps.

Generateur de rubans CSS

Pour beaucoup, nous pourrions nous demander l’intérêt d’un tel outil… C’est vrai. Pourtant, il nous arrive parfois d’avoir besoin de créer ce type de forme pour la création d’un thème. Ribon Builder de Live Tool propose de vous aider dans la conception d’un ruban en pure CSS (Pas d’image, juste du code), plus léger et surtout bien plus rapide à faire.

Un problème cependant, l’intégration dans une feuille de style CSS responsive. C’est un peu plus difficile !

Le même site propose d’autres outils, tout aussi efficaces.

Optimiser ses images

Smush it : un utilitaire onlinel indispensable pour l’été… La perte de poids étant d’actualité ! Dans ce cas, il s’agit surtout d’alléger vos images avant de le poster sur le web. Cela sans perte de qualité.

Smush it, est un outil Yahoo developper network.

Petit Grégory et Communication

Une photo du petit Grégory pour la publicité d’une garderie. Il fallait le faire !
Certes, c’est un vrai « buzz » et, dans le milieu du marketing, cela pourrait avoir des conséquences heureuses ! … Mais pas cette fois ! Parce que c’est une vraie faute de goût et que, surtout, ce n’est pas du marketing mais de la « communication » … au rabais !

Peut-on décemment blâmer, comme le font les organisateurs du festival, la graphiste de 20 ans, qui était en stage de formation pour l’été ?
C’est bien trop facile de se déculpabiliser, quand on sait que pour des raison financières, on l’aura prise en stage de formation au lieu d’embaucher un professionnel. Qu’on lui aura probablement dit : « Pour la photo ? non on achète rien ! tu trouveras bien quelque chose sur le net. Regarde dans Google image, tu trouveras ton bonheur ! » . Rajoutons pour sa défense qu’aucun responsable ne semble avoir pris le temps de contrôler son travail avant édition du programme… c’était pourtant un stage de formation !

Alors oui, pourquoi payer les images quand on les trouve « gratuitement » sur Google ? Pourquoi payer des professionnels quand on peut avoir des stagiaires ? Pourquoi prendre au sérieux le travail de communication ? Après tout il est juste question de faire des collage plus ou moins harmonieux et mettre un texte plus ou moins informatif … des compétences à la porter de tout le monde !

Le problème c’est bien l’argent. A force de tirer les prix vers le bas, cela devait arriver ! Voici comment le « vraiment pas cher ! » va finir par coûter très cher au Festival de Montreux : La famille Villemin va porter plainte contre les organisateurs du festival qui n’ont pas d’excuse rationnelle à fournir, sinon la volonté de faire des économies.

Du buzz et de l’humour

« The world without Mobile » (le monde sans mobile), une vidéo virale sympathique, absurde, hilarante et, du coup, vraiment efficace en terme de communication. Cela à la gloire du mobile et de Qualcomm, une société états-unienne spécialisée dans la conception et la fabrication de solutions de télécommunications. Si Qualcomm voulait faire connaitre sa marque et bien … c’est réussi et c’est tout le succès que cette société mérite. (presque 100 000 visionnages 12 heures après sa publication sur Youtube).

Beautifier Css et html

Pour les amoureux de l’ordre et de la clarté : quelques outils qui devraient vous faire gagner du temps. Des outils capable de mettre de l’ordre dans les arborescences de vos fichiers html, php ou CSS.

Pour les fichier Css : PROCSSOR (propose plusieurs paramétrage)

 

ou FreeFormatter pour le HTML (chosissez l’option Tab Delimited, qui allège votre fichier)

Merci à Maxime pour les liens.

Google+ deuxième réseau social

Cela devait arriver, Google plus est devenu le deuxième réseau social du web avec 360 Millions de membres. Certes, il reste loin de son plus sérieux concurrent Facebook, mais  il est net que Google+ sait se faire aimer. Le potentiel SEO pour le local Marketing, c’est vrai ! Mais aussi les services, dont le fameux  « hangout » : outil de visioconférence ultra pratique et terriblement addictif dans le cadre du personnel comme du professionnel.

Infographie Google+ 2012.

Sources : 01net

Dummies images pour wordpress

Un outil bien pratique pour tout concepteur de page web. Certes ce n’est pas nouveau, mais c’est toujours bien de l’avoir sous la main ou de se souvenir que cela existe.

Lorem Pixel est de loin le meilleur. De plus il est d’une facilité d’utilisation désarmante et il offre plusieurs choix de thème et « évidemment » toutes les possibilités de tailles.

Utilisation :

http://lorempixel.com/400/200/business/Dummy-Text/
Adresse/largeur/hauteur/thème/avec du texte sur l’image/

Vous pouvez faire varier les thèmes, la largeur et la hauteur. A vous de choisir ce que vous voulez.

Analyser le partage sur Tweeter

RetweetLab

RetweetLabComment savoir quelles sont les incidences de nos actions sur tweeter ? Encore une fois par le biais des outils analytiques à disposition. C’est bien là la force du net, tout est mesurable et nous aurions tort de ne pas nous servir des informations disponibles pour améliorer nos actions marketing. Il suffit de trouver les outils adéquates quand ils existent ou de les créer dans le cas échéant. C’est ainsi qu’est nait RetweetLab, dans les bureaux d’Hubspot.

Cet outil permet d’analyser l’impact de nos tweets, mais également de ceux de nos concurrents. Ainsi vous allez savoir quel type d’informations suscitent le partages, quels jours et à quelles heures les tweets ont été retweetés, mais aussi les sentiments positifs ou négatifs produits par ceux-ci.  Ces statistiques suivis d’une petite analyse vous aidera pour l’optimisation et l’amélioration des prochaines actions de communication sur Tweeter.

Pour mieux prendre en main l’outil une sorte de mode d’emploi.

Générateur de longue traine

longue traine

longue traine

Pour un meilleur positionnement, pour de meilleurs taux de transformations, rien de tel qu’ un référencement qualifié. Il est de plus en plus nécessaire de spécialiser, de cibler ou de spécifier son offre pour être trouvé et sélectionné parmi les nombreux concurrents qui existent sur le net. Bien plus évident d’être trouvé dans la masse sur une requête un peu plus précise telle que « restaurant chinois végétarien Paris » que sur « restaurant paris ». Une question de bon sens (toujours) et, avec l’aide de quelques outils, vous allez aussi pouvoir trouver de l’aide pour bien vous positionner. (suite…)

Etes-vous « infobèse » ?

Vous êtes surchargé d’informations et cette situation affecte votre productivité ? Vous êtes donc Infobèse et cela génère chez vous du stress !

Pour comprendre ce qu’est l’infobèsité :

Pour calculer votre Infobèsité.

Ne vous inquiétez pas trop cependant vous faites parti des 1 travailleur sur deux qui sont atteints de cette nouvelle « maladie » des TIC. Sachez que tout cela se soigne avec un peu de méthodologie :

  • Savoir se discipliner : fermez les réseaux sociaux et les alertes mail ou téléphone quand vous faites un travail important.
  • Classer : ses emails et ses rendez-vous par ordre d’importance avant de les lire ou de répondre.
  • Se relaxer : Prenez un pause quand vous le sentez et allez boire un café un verre d’eau avec des personnes avec qui vous pourrez parler d’autre chose que de boulot.
  • S’éloigner parfois :choisissez Free comme opérateur et partez à la campagne pour une promenade. Vous pouvez même amener votre smartphone il y aura pas mal de chance que vous n’ayez pas de réseaux. Laissez vous aller à oublier Facebook, Skype, votre messagerie mail, … rien n’est important sauf vous !

Source Emmanuel

Vertical Vidéo Sydrome

Parfois, pour ne pas dire trop souvent, il nous arrive de visionner des vidéos verticales sur le net. Comment est il possible et pourquoi faire des vidéos verticale quand nos écrans sont toujours et cela depuis longtemps horizontaux ? Erreur ou grand n’importe quoi ?
Cette vidéo humoristique autant que pédagogique tente de répondre à cette question et souhaite que cette hérésie filmique cesse enfin.

Achetez sur le net !

Google qui se moque, à travers son agence de pub Google Creative Lab, des pratiques du web et tente de les replacer dans un contexte réel.
Il est vrai que certains sites ne facilitent pas l’acte d’achat en ligne. Et ce n’est pas seulement une question d’ergonomie, mais plutôt de « force de vente » très agressive. Il est bien d’utiliser certaines pratiques du webmarketing pour vendre plus et mieux. Mais les utiliser toutes les unes après les autres … c’est parfois un peu dur pour le visiteur/acheteur. Le risque étant de le voir partir et savoir ce qui l’a fait partir… d’où cette pub pour Google Analytics.