OceanWP : est-il encore possible de se passer de ce thème WordPress ?

Il n’est pas aussi connu que des sportifs ou des chanteurs célèbres.

Mais s’il continue sur sa lancée, il pourrait l’être un jour, tant sa croissance est vertigineuse.

Lui, c’est OceanWP, « un thème gratuit de qualité avec des caractéristiques premium », comme l’explique la page À Propos du site qui lui est dédié.

Avec plus de 700 000 installations actives et une ribambelle d’avis positifs (note de 4,9 sur 5 sur plus de 4 700 avis laissés au moment d’écrire ces lignes), notre thème du jour est tout simplement incontournable sur le répertoire officiel WordPress.

Le genre de truc à côté duquel vous n’avez vraiment pas envie de passer.

Mais avant de vous jeter dessus tel un mort de faim (sur le thème, pas le gâteau de cette petite fille), vous devez savoir si vous pouvez miser sur notre cheval pour vos prochains projets.

Pour vous aider, j’ai enfilé ma plus belle casaque pour vous servir un test détaillé.

Comme je l’ai fait dans les articles consacrés à GeneratePress et à Astra, je vais notamment vous parler de :

• la maniabilité d’OceanWP ;
• son impact sur la performance et le SEO ;
• ou encore de son rapport qualité-prix.

Certains liens que vous trouverez dans cet article sont dit « affiliés ». C’est-à-dire que WPMarmite touchera une petite commission si vous décidez de vous procurer un des produits présentés. Cela ne vous coûtera pas plus cher et c’est une façon de nous remercier pour les articles que l’on vous propose !

Initialement rédigé en juin 2019, cet article a été mis en jour en mai 2021. La version d’OceanWP issue du répertoire officiel testée dans cet article est la 2.0.7.

OceanWP, un thème gratuit vraiment premium ?

J’y reviendrai en détails un peu plus loin dans cet article, mais OceanWP est un thème un peu à part.

Il ne propose pas de version Pro à proprement parler, mais des extensions payantes (add-ons) qui ajoutent des fonctionnalités à son thème gratuit (ex : un en-tête fixe, des widgets pour Elementor, une marque blanche etc.).

Exactement comme le fait WooCommerce, par exemple.

Nicolas Lecocq, le créateur du thème, explique avoir opté pour ce business model afin de se démarquer de la grande majorité de ses concurrents (la plupart vendent des thèmes freemium ou premium).

Depuis le lancement du thème, fin 2016, « ce modèle a très bien marché pour lui », comme il l’a affirmé dans cet article.

Difficile de le contredire au moment de se pencher un peu plus sur le sujet, tant la progression d’OceanWP est exponentielle.

Si l’on excepte les thèmes WordPress natifs (Twenty Twenty One, Twenty Twenty etc.), OceanWP est le troisième thème le plus populaire du répertoire officiel, juste derrière le géant Astra (1 million+ installations actives) et et Hello Elementor (700 000+ installations actives).

Les chiffres donnent le tournis. Installé sur plus de 600 000 sites, OceanWP jouit aussi d’une sacrée cote auprès de ses utilisateurs.

Il est quasi-impossible de lui trouver des détracteurs.

Mais alors, qu’est-ce qui rend les gens si accros ? La page d’accueil du thème donne quelques éléments de réponse. OceanWP serait :

• totalement responsive ;
• compatible WooCommerce : il prétend être le « meilleur ami de WooCommerce » ;
• composé de très nombreuses démos activables en quelques clics ;
• conçu en respectant les meilleures pratiques SEO ;
• doté d’un support génial ;
• compatible avec les langages RTL et traduisible dans n’importe quelle langue ;
• compatible avec tous les meilleurs constructeurs de page du marché.

Sur le papier, ces arguments restent intéressants, mais somme toute assez classiques et aguicheurs : il faut bien vendre sa soupe. Mais est-elle vraiment bonne ?

Comme ajoute Nicolas Lecocq, « avec OceanWP, n’importe qui peut créer un joli site web professionnel, peu importe son expérience en matière de webdesign et développement ».

Alex n’est pas aussi catégorique. Dans la vidéo de L’Instant Thème consacrée à OceanWP, sur la chaîne YouTube de WPMarmite, il ne le conseillerait pas en priorité aux débutants, en raison de ses nombreuses options au sein desquelles il est facile de se perdre.

Maintenant, il ne vous reste plus qu’à vous faire votre propre opinion en lisant les prochaines lignes.

Démarrons par la maniabilité du thème, avec un p’tit tuto d’installation d’OceanWP.

Quelle maniabilité ?

Processus d’installation du thème

L’option la plus simple consiste à passer par votre Tableau de bord WordPress.

Dirigez-vous sur Apparence > Thèmes. Puis en haut de la page, cliquez sur Ajouter.

Dans la barre de recherche, entrez OceanWP, puis installez et activez le thème.

Si tout se passe bien, OceanWP devrait ensuite vous recommander d’installer l’extension Ocean Extra.

Cette dernière ajoute des fonctionnalités supplémentaires au thème OceanWP, telles que des widgets, des boîtes de métas, activer/désactiver les sections de l’outil de personnalisation, activer/désactiver les scripts & styles du thème, importer/exporter et un panneau pour activer les extensions premium.

Je vous conseille de suivre les recommandations du développeur, car cette extension va notamment vous proposer d’utiliser un assistant de configuration.

Si vous passez outre les recommandations du développeur, vous vous retrouverez avec le thème de base, que vous pourrez ensuite personnaliser comme bon vous semble, bien sûr.

Allez, revenons à nos moutons. En cliquant sur Lancer l’assistant de configuration, un requin bodybuildé vous accueille en vous saluant de la nageoire : cliquez sur le bouton bleu Commencer.

Prêt pour 4 étapes ? C’est parti.

Étape 1 : le choix d’une démo. Il y en a 15 au total couvrant plusieurs domaines (Blog, Business, Sport, One Page, Corporate, Ecommerce).
Comme j’aime bien le sport, je suis parti sur le modèle Gym (vous n’êtes pas obligé de choisir une démo et pouvez aussi directement passer à l’étape Personnaliser, si vous le souhaitez).

Étape 2 : l’installation d’extensions « nécessaires ». Il est ici précisé qu’« il est recommandé de téléverser les données d’exemples sur une nouvelle installation WordPress pour éviter les conflits avec votre contenu actuel. »

Le thème est gratuit mais on vous demande d’installer plusieurs extensions afin que le site ressemble exactement à la démo proposée. 

Il y a là notamment Elementor, le constructeur de page le plus populaire de l’écosystème WordPress (+ de 5 millions d’installations actives). Mais aussi WP Forms (pour créer des formulaires de contact), ou encore Ocean Sticky Header et Ocean Elementor Widgets, qui sont deux modules… vendus chacun 35,99 $, TVA incluse (environ 30 €).

Du coup, j’active juste ceux qui sont disponibles gratuitement (Elementor, WP Forms et Ocean Social Sharing) et j’importe mes données au bas de la page.

Chez moi, l’importation a mis une vingtaine de secondes à peine.

Étape 3 : vous pouvez à présent commencer à personnaliser votre site en ajoutant votre logo, une favicon, un slogan, ou encore en choisissant vos couleurs principales.

Étape 4 : Votre site web est prêt. Si vous voulez aller plus loin, on vous propose d’essayer d’obtenir le pack d’extensions premium d’OceanWP, en échange de votre adresse email (voilà un formulaire d’opt-in bien senti 😉). Pour en bénéficier gratuitement, il faudra compter sur la chance, et faire partie des 5 personnes qui sont tirées au sort chaque mois.

Il ne vous reste plus qu’à cliquer sur le bouton Voir votre site web pour découvrir le résultat final.

Alors, résultat des courses ?

Commençons par les points positifs de ce processus d’installation. Je trouve que l’assistant est très utile pour les débutants.

On est pris par la main et chaque étape est vraiment claire. Au final, si l’on choisit d’installer une démo pré-conçue, on obtient un site tout-prêt avec plusieurs pages sans avoir rien fait, ou presque.

Mais, il y a quand même un mais, justement.

En y regardant de plus près, j’ai remarqué que certaines sections étaient vides sur mon site fraîchement installé.

Un exemple ? Le tableau de prix. Regardez, à part le titre et le sous-titre, il n’y a rien.

En fait, c’est le plugin premium Ocean Elementor Widgets qui aurait dû faire le travail.

Mais comme je ne l’ai pas installé – acheté, en fait – précédemment, on se retrouve avec cet espace vide, sans l’affichage des prix.

Un peu dommage, même si vous avez la possibilité de recréer les zones manquantes avec une extension de votre choix, si vous ne souhaitez pas opter pour les plugins premium proposés par OceanWP.

Pour le processus d’installation, vous êtes pas mal. Je vous propose désormais de découvrir ce que nous cachent les options du thème, sur le Tableau de bord.

À la découverte du Tableau de bord

Vous retrouverez les options du thème sur le menu Theme Panel, situé sur la colonne de gauche de votre administration WordPress.

Mais attention, cela sera le cas uniquement si vous avez installé l’extension Ocean Extra juste après l’activation du thème. D’où l’importance de le faire. J’espère que vous suivez ;-).

Au sein de ce Theme Panel, vous retrouverez diverses sections de l’Outil de personnalisation (le fameux Customizer WordPress). Vous pouvez les activer ou les désactiver pour améliorer le temps de chargement.

Des liens vous permettent aussi de personnaliser rapidement certains aspects de votre site (ex : logo, typographie, couleurs, barre latérale etc.).

Je trouve dommage que plusieurs messages pour vous encourager à vous procurer les extensions premium rendent la page un peu moins lisible. Par contre, on apprécie de bénéficier d’une interface de réglages parfaitement traduite en français.

Au total, six options sont proposées :

1. Ma bibliothèque : elle vous permet de créer vos propres modèles de pages que vous pouvez ensuite utiliser à l’envi de plusieurs façons : grâce à un shortcode , l’extension Ocean Hooks, le widget shortcode d’Elementor, ou du code PHP personnalisé ;
2. Scripts & styles : cette option vous permet d’activer ou de désactiver en 1 clic les scripts CSS et JavaScript que vous ne souhaitez pas utiliser. C’est très utile pour améliorer la vitesse de chargement de vos pages : bien vu ! Par contre, il y en a une cinquantaine, et tous ne sont pas forcément compréhensibles pour un débutant. Si vous n’êtes pas sûr de ce que vous faites, ne touchez à rien ;
3. Importer/Exporter : permet d’importer ou d’exporter les réglages de votre site dans un fichier .dat ;
4. Installer des démos : vous retrouvez ici les 15 démos que vous avez découvertes pendant le processus d’installation du thème. Il est possible de les prévisualiser, puis de les activer très facilement en quelques clics ;
5. Add-ons : présente les 20 extensions d’OceanWP (13 premium et 7 gratuites). Vous les découvrirez en détails un peu plus tard ;
6. Upgrade : pour se procurer la version Pro du thème ;

Sans transition, passons à l’étape suivante : la personnalisation du thème. Vous allez mettre les mains dans le cambouis, c’est moi qui vous le dis !

Apprenez le CSS une bonne fois pour toutes

Créez des sites au rendu impeccable sans y passer des heures avec CSS Express.

Découvrir la formation

La personnalisation du thème

L’Outil de personnalisation

Sur OceanWP, la très grande majorité des réglages s’effectue depuis l’Outil de personnalisation, ce qui est vraiment très appréciable.

Cela vous facilite la vie car tout est centralisé au même endroit.

Pour info, vous retrouverez l’Outil de personnalisation en vous rendant dans Apparence > Personnaliser.

Comme vous pouvez le constater, les options sont très nombreuses. Au total, il y a 14 « menus » principaux différents, ce qui est particulièrement abondant pour un thème freemium.

A titre de comparaison, Astra et GeneratePress, qui sont deux thèmes au profil assez similaire à OceanWP, disposent de moins de menus d’options à ce niveau, dans leur version gratuite.

Au sein de cet Outil de personnalisation, donc, vous retrouverez certains réglages classiques (Identité du site, Menus, Réglages de la page d’accueil, Widgets etc.).

Je ne vais pas m’y attarder dessus, sachant qu’Alex vous propose déjà un aperçu détaillé des options dans cette vidéo :

Ici, on va plutôt développer quelques fonctionnalités qui me semblent majeures, et qui méritent le détour.

Options générales

Parmi les éléments intéressants de ce menu, je pourrais vous citer :

• la possibilité de personnaliser le style de mise en page (large, encadré ou séparé). Pouvoir afficher votre contenu en pleine largeur est très intéressant, notamment si vous couplez le thème à un constructeur de page par la suite. Il est aussi possible de régler au pixel près la largeur de votre contenu et de votre barre latérale (sidebar). Pour cette dernière, vous avez le choix entre l’affichage d’une ou deux barres latérales (à gauche, à droite, les deux ensemble), ou pas de barre latérale du tout ;
• une fonctionnalité pour appliquer vos couleurs favorites uniformément sur toutes les pages et articles de votre site, afin de gagner du temps ;
• les nombreuses options pour créer une flèche Back to top (Retour vers le haut de la page). 10 icônes sont proposées, et vous pouvez même aller jusqu’à personnaliser le rayon de la bordure ;

• le contrôle total sur votre page d’erreur 404, si vous le souhaitez, grâce à l’utilisation d’un template créé au préalable dans votre Bibliothèque issue du Theme Panel ;
• l’option Theme Icons, qui permet de choisir entre des icônes issues des bibliothèques Font Awesome et Simple Line Icons. Il s’agit d’une nouveauté introduite avec la version 2.0.0 d’OceanWP, lancée fin 2020. Au passage, ce menu permet également de paramétrer la couleur des icônes fournissant des informations sur un article de blog (date, auteur, catégorie, nombre de commentaires etc.).

Barre supérieure

Comme son nom l’indique, cette option vous permet d’activer et de personnaliser une Barre supérieure sur votre site.

Cela peut être utile pour afficher certaines infos de contact à vos visiteurs dès leur arrivée sur votre site (numéro de téléphone, adresse, email, etc.), ou encore vos réseaux sociaux.

Vous pouvez aussi lui assigner le menu personnalisé de votre choix et bien sûr modifier les couleurs d’arrière-plan du texte, des liens etc., et choisir de désactiver cette barre supérieure sur certains appareils (ex : smartphones et tablettes).

En-tête

En-tête (header) est un menu que j’ai trouvé vraiment super. Les options sont vraiment très poussées.

Par exemple, il est possible, parmi les 8 styles proposés, de créer un en-tête transparent afin que ce dernier se fonde dans une image d’arrière-plan, ou une vidéo.

Il est même possible de régler sa hauteur et d’installer un en-tête personnalisé, grâce à un template que vous aurez créé au préalable dans votre Médiathèque, par exemple à l’aide d’Elementor. Vous pourrez même, ensuite, choisir d’afficher tel ou tel header sur la page ou l’article de votre choix.

Par ailleurs, vous pouvez également :

• Télécharger un logo Retina et régler la hauteur et la largeur de votre logo directement depuis l’Outil de personnalisation. Plutôt pratique.
• Paramétrer une dizaine d’effets sur les liens de votre menu. Regardez ce que ça donne avec celui appelé Triple point sous :

• Gérer finement les points de rupture, c’est-à-dire le moment où vous souhaitez afficher le menu mobile, ainsi qu’afficher un logo différent pour les mobiles et tablettes.
• Personnaliser votre menu mobile dans les grandes largeurs en choisissant notamment de l’afficher dans une colonne latérale, un menu déroulant ou en plein écran. Vous pouvez aussi modifier son icône et ses couleurs.

Êtes-vous certain de savoir ce qu’est un bon header sur WordPress ? Pour vous en assurer, allez procéder à quelques vérifications d’usage sur le blog de WPMarmite.

Blog

La partie Blog est hautement personnalisable. Pour commencer, vous pourrez agir sur 2 niveaux : « Entrées du blog » – c’est-à-dire la page où sont listés tous vos articles -, et « Article unique », qui permet d’effectuer des réglages sur les articles en eux-mêmes.

Les options de ces deux « menus » sont quasi-identiques. Parmi elles, j’ai apprécié le fait :

• de pouvoir glisser-déposer la dizaine d’éléments de votre choix (Titre, contenu, image mise en avant etc.) et de les désactiver en 1 clic ;

• d’avoir le choix du style de pagination du blog (Standard, Défilement infini, Suivant/Précédent) ;
• de pouvoir régler la longueur de l’extrait ;
• d’afficher ou non des barres latérales et votre contenu en pleine largeur ;
• de proposer un module pour afficher des contenus similaires. Cela peut être utile pour créer des liens internes, et donc pour votre référencement naturel. Et cela vous évite aussi d’activer une extension supplémentaire pour remplir cette tâche.

Pied de page

En fonction du thème que vous utilisez, personnaliser votre pied de page (footer) peut parfois s’avérer fastidieux, surtout si vous avez peu de connaissances en code.

Souvent, la première chose que l’on souhaite modifier pour rendre son site plus professionnel, c’est le Copyright (qui n’a d’ailleurs aucune valeur légale en France, au passage). Et il n’est pas toujours évident d’y parvenir sans passer par certains fichiers du Core (Coeur) de WordPress.

A ce niveau-là, OceanWP vous facilite la tâche. Via son menu Bas du pied de page (toujours dans l’Outil de personnalisation), il est possible d’entrer le texte de votre choix, sans vous embêter à mettre les mains dans le cambouis.

Autres possibilités très intéressantes :

• vous pouvez ajouter des codes courts (shortcodes) pour afficher certains éléments comme une barre de recherche, un panier si vous avez une boutique e-commerce, un bouton pour vous connecter/déconnecter etc. ;
• il est possible de masquer le pied de page sur certains appareils (ex: smartphones et/ou tablettes) ;
• vous pouvez modifier les couleurs d’arrière-plan, du texte et des liens ;
• vous pouvez ajouter jusqu’à 4 colonnes de widgets (grâce au menu Widgets de pied de page) pour afficher certains éléments de votre choix (ex : icônes de réseaux sociaux, menu etc.).
• intégrer un effet parallaxe est possible, si cela vous dit ;
• enfin, vous pouvez créer votre propre footer personnalisé à l’aide d’Elementor et paramétrer son affichage directement sur l’Outil de personnalisation.

Jusqu’ici, vous avez découvert des fonctionnalités natives du thème, intégrées dans l’Outil de personnalisation.

Sachez qu’OceanWP est aussi modulable et bénéficie d’options additionnelles dont vous pouvez profiter en activant des extensions spécifiques, gratuites et premium.

Commençons par les gratuites, à découvrir juste en-dessous. Allez, on scrolle !

Les extensions gratuites

Au moment d’écrire ces lignes, OceanWP en propose 8. Vous pouvez les retrouver depuis l’interface d’administration de votre Tableau de bord (Menu Extensions), ainsi que sur le répertoire officiel de WordPress.

Parmi elles, on peut notamment détacher :

Ocean Extra

Encore une fois, je vais me répéter, mais mieux vaut deux fois qu’une : selon moi, Ocean Extra est juste incontournable si vous utilisez le thème, alors installez cette extension (qui sera par ailleurs nécessaire pour activer… d’autres extensions propres à OceanWP).

Son gros plus réside dans l’ajout de boîtes de métas, c’est-à-dire un encart Réglages à la fin de chaque article, page ou type de contenu personnalisé (custom post type).

Cela peut être très utile pour créer des pages sur-mesure.

Parmi les options proposées ici, vous pourrez notamment :

• mettre en place une mise en page personnalisée et activer/désactiver les barres latérales ;
• ajouter des shortcodes (dans l’en-tête, la barre supérieure, le pied de page etc.) ;
• activer/désactiver le titre de la page, les widgets ou encore le copyright ;
• afficher ou non un menu en particulier.

Ocean Social Sharing

Faisons maintenant une petite halte sur l’extension Ocean Social Sharing.

Comme son nom l’indique, elle ajoute des boutons de partage au sein de vos articles.

Les principaux réseaux sociaux sont présents (Facebook, Twitter, LinkedIn etc.) et les options de personnalisation sont assez sympathiques pour un plugin gratuit.

Vous remarquerez qu’il est possible :

• de choisir la position de vos icônes (avant, après, ou avant et après le contenu) ;
• d’afficher le nom du réseau social ;
• d’inscrire le texte introductif de votre choix (ex : partagez sur les réseaux sociaux) ;
• de modifier le style des boutons (minimal, coloré ou foncé) et leur marge.

Bref, c’est vraiment pas mal. Petit bémol, quand même : il n’est pas possible d’afficher vos boutons de partage sur des pages.

Pour une solution complète, vous devrez utiliser une extension dédiée comme Social Warfare, par exemple.

Tiens, en parlant de réseaux sociaux, sachez que si vous utilisez WooCommerce ou Easy Digital Downloads, OceanWP propose aussi l’extension Ocean Product Sharing, qui permet « d’ajouter des boutons de partage social à votre page produit ».

Custom Sidebar

Grâce à Ocean Custom Sidebar, vous allez pouvoir créer le nombre de sidebars de votre choix et les placer où vous le souhaitez.

Une fois activé, une option Colonnes latérales apparaît dans le Theme Panel. Donnez un nom à votre sidebar (ex : sidebar test), puis retrouvez-la dans vos widgets (menu Apparence > Widgets). Il ne vous reste plus qu’à y ajouter les widgets de votre choix.

Pour un tour d’horizon tout à fait exhaustif, vous trouverez aussi les extensions gratuites suivantes :

• Ocean Stick Anything, pour rendre fixe n’importe quel élément de votre site, grâce à sa classe CSS.
• Ocean Posts Slider, qui permet d’afficher vos derniers articles dans un diaporama. Pourquoi pas, mais gare aux sliders, qui peuvent ralentir votre site.
• Ocean Modal Window, pour créer une fenêtre modale – qui s’affiche sur toute la largeur de votre écran au clic – dans laquelle insérer le contenu de votre choix.

Ocean Demo Import, qui permet d’importer le contenu des démos de sites, est toujours proposée au téléchargement, mais elle n’est plus nécessaire. Depuis août 2019, toutes les démos gratuites sont incluses dans l’extension Ocean Extra.

Les extensions d’OceanWP Premium

Pour encore plus de choix, OceanWP propose également 13 extensions Premium.

Vous pouvez :

• soit les acheter à l’unité : le prix affiché est de 29,99 $/an (environ 25 €/an), mais avec la TVA, il vous en coûtera au total 35,99 $/an (environ 30 €) ;
• soit vous procurer un pack global, une sorte d’OceanWP Pro, contenant les 13 extensions Premium (*) + 20 démos de sites, à partir de 34,99 $/an (41,99 € avec la TVA, soit environ 35 €). C’est en tout cas le prix proposé lorsque vous ajoutez une extension seule dans votre Panier.

(*) : Malgré ce que vous pouvez lire sur la capture ci-dessous, il y a bien 13 extensions premium au téléchargement sur votre compte OceanWP (et non 12), lorsque vous vous procurez la version Pro du thème. Sur votre interface d’administration WordPress, au niveau du sous-menu add-on, vous en trouverez même 14 ! Ce 14e addon n’est autre que l’extension Ocean Instagram, qui permet d’afficher votre fil de photos publiés sur le réseau social Instagram. Cette dernière devrait être de nouveau proposée aux utilisateurs d’OceanWP au mois de mai 2021.

A noter qu’entre la première version de cet article et sa refonte, le prix à l’unité de chaque extension a augmenté de 20 $, passant de 9,99 $ à 29,99 $ (environ 25 €). Le prix du pack global, lui, n’a pas bougé.

On incite donc le futur client à se procurer le pack global, ce qui est bien senti d’un point de vue marketing. Pour 5 $ supplémentaires (29,99 $ ou 34,99 $, soit environ 29 € TVA exclue), vous vous retrouvez avec un pack complet comprenant 13 extensions. Financièrement parlant, il n’y a pas photo. 

Mais revenons-en à nos extensions. Sachez que je les ai toutes testées. En voici trois qui me semblent incontournables pour commencer à personnaliser votre site, notamment si vous débutez.

Cela ne signifie pas que les autres sont dénuées d’intérêt. Simplement, elles répondent à des besoins plus techniques et spécifiques, comme vous le verrez juste après.

Elementor Widgets

Cette extension ajoute une cinquantaine de modules au constructeur de pages qui compte le plus d’installations actives sur le répertoire officiel (+ de 5 millions !).

Vous pourrez par exemple incorporer :

• des tableaux de prix ;
• des titres animés ;
• des formulaires de connexion ;
• des listes de prix etc.

Au niveau de l’intégration, tout est fluide et on ne perd pas en intuitivité. Je n’ai déploré aucun temps de latence.

Formez-vous à Elementor

Apprenez à créer votre site WordPress grâce au constructeur de page le plus populaire du marché.

Découvrir la formation

Sticky header

Nativement, OceanWP ne permet pas de créer ce que l’on appelle un sticky menu, soit un menu qui reste collé en haut de l’écran, même quand l’utilisateur scrolle dans la page.

Cette fonctionnalité est très utile pour faciliter la navigation de vos visiteurs et les inciter à rester sur votre page.

En premium, il est possible d’y parvenir grâce à l’extension Sticky header. Une fois que vous l’aurez activée, un nouveau menu sobrement baptisé Entête collante apparaîtra au bas de l’Outil de personnalisation.

J’ai notamment trouvé pas mal le fait de pouvoir ajouter un logo lorsque le menu devient sticky.

Grâce à l’extension Ocean Sticky Footer, il est aussi possible de rendre votre footer sticky, comme vous l’avez fait avec l’en-tête.

Et pour aller encore plus loin, le plugin Footer Callout ajoute une barre d’appel à l’action au sein de laquelle vous pouvez ajouter du texte et un bouton, tous deux facilement personnalisables (couleur, typographie).

Vous la trouverez sous l’appellation Bloc d’appel en pied de page dans l’Outil de personnalisation.

Et voilà ce que donne son intégration au sein d’une page :

Side Panel

L’extension Side Panel (appelée Panneau latéral dans l’Outil de personnalisation) permet de concevoir un genre de sidebar qui ne s’ouvrira que lorsque votre visiteur cliquera sur un bouton.

A l’intérieur, vous pouvez y glisser les widgets de votre choix. Pas mal pour ajouter du contenu additionnel que vous ne souhaitez pas forcément afficher automatiquement dans le corps de votre page.

Vous laissez ainsi à vos visiteurs le choix d’en découvrir plus ou non.

Parmi les extensions Premium, vous trouverez aussi :

• Ocean Hooks. J’avais prévu d’un peu plus vous parler de ce plugin, mais en le testant, il m’a semblé complexe pour un débutant. Mais rien ne vous empêche de vous faire votre propre avis 😉 Pour rappel, un hook (un hameçon, en français), est un point d’entrée dans une fonction WordPress. Avec Ocean Hooks, vous allez donc pouvoir ajouter des morceaux de code personnalisés afin d’aller encore plus loin que ce que proposent les extensions, et sans utiliser de thème enfant. Si vous connaissez bien le code, cette extension devrait vous plaire.
• Woo Popup, qui affiche une fenêtre pop-up (qui s’affiche en surbrillance de la page) sur votre boutique WooCommerce, lorsqu’un visiteur ajoutera un produit dans son Panier.
• White Label. Cette extension permet de remplacer la marque OceanWP par le nom de votre choix, comme celui de votre entreprise, notamment au niveau de l’administration et du nom du thème.
• Portfolio, pour créer une galerie d’images.
• Full Screen. Cette extension affiche votre page en plein écran au scroll, mais elle fonctionne uniquement si Elementor est activé.
• Cookie Notice, qui ajoute un bandeau pour informer vos utilisateurs que votre site utilise des cookies et qu’il est conforme à la réglementation RGPD.
• Popup Login permet d’ajouter un formulaire pour demander à vos visiteurs de se connecter à votre site.
• Ocean Pro Demos, qui ajoute une centaine de templates supplémentaires, par rapport à la version gratuite.

En conclusion, que retenir des extensions Premium ?

De façon générale, je trouve d’abord qu’il n’est pas toujours simple de s’y retrouver : certaines d’entre elles se paramètrent depuis le Tableau de bord, d’autres depuis l’Outil de personnalisation (pour la majorité d’entre elles, c’est le cas).

Ensuite, je dirais que certaines extensions gratuites disponibles sur le répertoire officiel peuvent être tout aussi efficaces. Par exemple, Cookie Notice for GDPR & CCPA peut remplacer Cookie Notice ; Envira Gallery permet aussi de créer une galerie photo en tant que portfolio, comme l’extension Portfolio d’OceanWP.

Les démos de sites

Comme je vous l’ai détaillé lors du processus d’installation, la version gratuite du thème donne accès à 15 démos de sites (OceanWP theme demos, en anglais).

Pour rappel, il s’agit de templates prêts à l’emploi, activables en 1 clic, qui vont installer un site complet en un claquement de doigts (ou presque).

La version Premium propose plus d’une centaine de modèles de templates d’OceanWP en plus, par rapport à l’offre gratuite. Pour un total de plus de 130 démos.

Pour les installer, il suffit d’activer l’extension Pro Demos contenue dans l’une des trois offres Premium (je vous les détaille dans la Partie sur les tarifs, un peu plus bas).

De nouveaux modèles viennent donc gonfler l’offre proposée dans les catégories de base (Business, Blog, Sport, One Page, Corporate, eCommerce).

Un nouvel onglet Coming Soon a aussi fait son apparition, vous donnant la possibilité de mettre en place des pages Coming Soon, c’est-à-dire des pages de maintenance avant le lancement d’un site, par exemple.
Au total, 5 template sont présents dans cet onglet.

Les templates vous permettront d’activer des sites à destination des professionnels dans tout un tas de domaines (coiffeurs, agences web, restaurants, photographie, mariages, fitness, fleuristes, etc.).

A noter également la présence de 60 modèles spécialement dédiés aux boutiques ecommerce.

Cette fois, vous en avez terminé avec la personnalisation du site.

Désormais, je vous propose de découvrir comment le thème se comporte avec les constructeurs de page et les plugins.

Quelle adaptation aux constructeurs de page et aux plugins ?

OceanWP et les constructeurs de page

Comme l’explique la page d’accueil du site d’OceanWP, le thème de Nicolas Lecocq a été « façonné pour fonctionner avec les meilleurs constructeurs de page du marché ».

Pour vous en persuader, les logos de célèbres page builders comme Elementor, Divi Builder ou encore Beaver Builder sont d’ailleurs affichés ostensiblement.

En revanche, ce que l’on peut vous affirmer avec certitude, c’est qu’OceanWP a son premier de la classe : Elementor.

D’abord, comme vous l’avez constaté, OceanWP vous demande très souvent de l’installer pour que ses démos puissent fonctionner correctement.

Ensuite, le thème dispose d’une extension premium spécifique, Elementor Widgets, que vous avez découverte un peu plus haut, en principe.

Mais Elementor le lui rend bien également. Dans sa documentation, le constructeur de page précise qu’OceanWP est l’un des thèmes qui fonctionne le mieux avec lui.

Enfin, au-delà de ces échanges d’amabilité, sachez qu’OceanWP reste très pratique à utiliser avec un constructeur de page, de façon globale.

Grâce à l’encart Réglages présent au sein de chaque page, vous pouvez notamment contrôler la mise en page en affichant votre contenu en pleine largeur, en désactivant les sidebars, le titre de vos pages etc.

OceanWP et WooCommerce

Au sein de l’écosystème WordPress, OceanWP a aussi très bonne presse en raison de son excellente compatibilité avec WooCommerce.

En effet, il propose de nombreuses fonctionnalités pour personnaliser votre boutique en ligne.

Pour en profiter, vous devez avoir activé WooCommerce, au préalable.
Avec la version Premium d’OceanWP, vous disposez de 60 démos prêtes à l’emploi pour votre boutique e-commerce, dans divers domaines (Services, livres, bijouterie, streetfood, chaussures, jardinage, mode, etc.).

Les réglages s’opèrent depuis l’Outil de personnalisation, ce qui est assez rare à trouver chez des thèmes concurrents.

Ils sont de plus assez intuitifs et pratiques pour les débutants. Par exemple, vous pouvez changer la position des éléments récapitulatifs (Prix, Note, Extrait, Ajouter au panier, etc.) en les glissant-déposant.

OceanWP dispose aussi de plusieurs options natives pour favoriser l’expérience utilisateur et inciter à la conversion.

Par exemple, une fenêtre pop-up s’affichera pour inciter vos visiteurs à valider leur commande lorsqu’ils survoleront leur Panier.

L’option « Vue rapide » permet quant à elle d’afficher des informations détaillées sur un produit, sans que votre visiteur n’ait à quitter la page.

On peut aussi noter la présence d’une option pour rediriger directement vers la page de paiement dès l’ajout d’un article au Panier (accessible sur la version gratuite du thème), afin de supprimer des étapes et d’éviter les « frictions » avant le paiement.

En parlant de WooCommerce, si vous comptez mettre sur pied en boutique en ligne prochainement, je vous invite à découvrir cette vidéo d’Alex :

Par ailleurs, la dernière version majeure en date sortie par OceanWP fin 2020, la 2.0.0, propose plusieurs nouveautés concernant WooCommerce : 

• Vous pouvez désormais contrôler l’affichage conditionnel du bouton « Ajouter au panier », ainsi que l’affichage du prix ;
• Il est possible d’afficher un message personnalisé à vos visiteurs afin de les inciter à se créer un compte ;
• De nouveaux réglages concernant la police d’écriture sont disponibles.

WooCommerce étant un plugin, la transition est toute trouvée pour terminer cette partie.

Qu’en est-il de la compatibilité d’OceanWP avec les extensions ?

En principe, vous ne rencontrerez aucun problème avec les plugins présents sur le répertoire officiel de WordPress.

Même si, comme vous le savez sûrement, personne n’est à l’abri d’un bug au moment d’une installation ou d’une mise à jour. Si cela vous arrive, vous pouvez toujours vous référer à notre guide sur les erreurs WordPress pour vous sortir de l’impasse.

Performance, SEO, responsive : zoom sur 3 aspects majeurs

Performance

Posséder un site rapide est très important pour favoriser l’expérience utilisateur de vos visiteurs.

Par exemple, on estime que 40 % des internautes quittent un site web s’il met plus de 3 secondes à charger.

Le temps de chargement peut aussi impacter votre positionnement sur les moteurs de recherche, même si cela joue de façon minime.

En effet, pour positionner une page, Google se base sur plus de 200 critères, dont la vitesse de votre page.

Alors autant vous dire que le thème que vous allez choisir va devoir assurer à ce niveau-là.

Le temps de chargement OceanWP est-il à la hauteur ? C’est ce que j’ai vérifié en lui faisant subir plusieurs tests.

Ci-dessous, votre trouverez mon mode opératoire :

• Services de test utilisés : WebPageTest (en utilisant à chaque fois Paris comme localisation) avec prise en compte du critère « fully loaded » (moment où le site est complètement chargé, incluant les scripts externes et applications) ; Pingdom Tools (en utilisant à chaque fois Londres comme localisation).
• Site de test hébergé sur un serveur mutualisé d’o2switch.
• Je n’ai activé aucun plugin.
• J’ai comparé OceanWP à un autre thème gratuit populaire (Sydney, 100 000 installations actives) issu du répertoire officiel de WordPress.

Test sur WebPageTest avec OceanWP activé : temps de chargement de 1,154s (fully loaded) :

Test sur WebPageTest avec Sydney activé : temps de chargement de 2,237s (fully loaded) :

Test sur Pingdom Tools avec OceanWP activé : temps de chargement de 629 ms

Test sur Pingdom Tools avec Sydney activé : temps de chargement de 2,03s

Résultat des courses : OceanWP est à ranger dans la catégorie des thèmes ultra-rapides.

En revanche, nos tests ont démontré qu’il est un peu moins performant que deux de ses concurrents : Astra (1,040s avec WebPageTest) et GeneratePress (0,942s avec WebPageTest).

Les résultats ci-dessus permettent d’avoir un premier aperçu, mais ne peuvent être considérés comme un jugement arrêté et définitif. Vous pourriez avoir des données différentes chez vous, en fonction de votre hébergement, ou encore des plugins que vous utilisez.
Si les services de notations de performances sont utiles, il ne faut pas non plus se focaliser là-dessus, mais plutôt sur « le temps de chargement réel de votre site » et « l’impression de fluidité », comme le détaille cet article.

Accélérez votre site internet avec WP Rocket

Transformez votre site en fusée grâce au plugin de cache reconnu le plus performant par les experts WordPress.

Essayez WP Rocket

Impact sur le référencement

OceanWP a été bâti en respectant les bonnes pratiques SEO. D’abord, il applique les standards de code de WordPress.

Ensuite, OceanWP utilise des données structurées Schema.org. Il s’agit d’une méthode de balisage HTML qui aide Google à comprendre de quel type est votre contenu.

Vous pouvez activer ce schéma de marquage via le menu Options générales > Réglages généraux de l’outil de personnalisation.

Enfin, n’oubliez pas que vous pouvez agir sur la vitesse de chargement de vos pages, et donc sur votre référencement, en activant les scripts et les styles de votre choix via le menu Scripts & Styles du Theme Panel.

Gestion du responsive

On dit d’un site web qu’il est responsive lorsqu’il s’adapte sur n’importe quel écran (ordinateur, smartphone ou tablette).

Vous vous en doutez sûrement un peu, mais si votre site ne s’affiche pas correctement sur smartphone, vous risquez de perdre pas mal de visiteurs en chemin.

Il est donc primordial de soigner cet aspect pour :

• Favoriser l’expérience utilisateur.
• Ne pas plomber votre taux de conversion.
• Ne pas pénaliser votre référencement naturel : depuis mars 2018, Google a mis en place l’indexation mobile-first. Cela signifie qu’il utilise principalement la version mobile de votre site pour indexer et positionner vos pages dans ses résultats.

Niveau responsive, est-ce qu’OceanWP s’en sort bien ? Un premier test manuel donne une première réponse positive.

En redimensionnant la fenêtre sur mon navigateur, aucun détail choquant ne m’a sauté aux yeux.

Mais pour plus de fiabilité, je me suis servi du test d’optimisation mobile de Google, qui a donné satisfaction  avec la page d’accueil du site dédié au thème.

Quel rapport qualité-prix ?

OceanWP est d’abord disponible gratuitement sur le répertoire officiel WordPress. Vous pouvez aussi l’installer directement depuis votre Tableau de bord WordPress.

Si vous voulez bénéficier de plus de fonctionnalités, 2 options sont disponibles :

• Vous procurer l’une des 13 extensions Premium à l’unité (29,99 $/an, soit environ 25 €, hors TVA).
• Opter pour l’un des 3 packs Premium (Personal, Business ou Agency).

En dehors du prix – la fourchette va de 39 $ (environ 32 €) à 129 $/an (environ 107 €) -, la principale différence entre les 3 offres réside dans la capacité d’utilisation.

En fonction de l’offre choisie, vous pourrez utiliser le thème sur 1 site (Personal), 3 sites (Business), ou 25 sites (Agency) au maximum.

Depuis l’écriture de la première version de cet article, OceanWP a modifié son offre la plus chère. Auparavant, il était possible de se procurer le thème pour l’utiliser de façon illimitée, via le pack Unlimited. Nicolas Lecocq, le développeur d’OceanWP, a abaissé cette limite à 25 sites (l’actuel plan Agency) en indiquant que la majorité des utilisateurs n’installaient pas son thème sur plus de 20 sites.

Pour le reste, les 3 offres comprennent les mêmes options, à savoir l’accès à 12 mois d’assistance (support) et de mises à jour, la présence de 13 extensions Premium et de 109 démos (templates de sites).

Notez également que vous pouvez bénéficier d’une Licence à vie afin de ne pas renouveler chaque année – à partir de 159 $ (environ 131 €) pour 1 site -, et qu’une réduction de 30 % est automatiquement appliquée si vous reconduisez votre Licence avant son expiration.

Afin de trouver le bon Plan, si je peux me permettre, tout dépend de vos besoins. Vous gérez un seul site ? L’offre Personal sera suffisante.

En revanche, si vous créez régulièrement des sites pour des clients, l’offre Agency propose un meilleur retour sur investissement, encore plus si vous la payez à vie.

Si vous créez des sites à grande échelle à l’aide des extensions premium d’OceanWP (le thème, gratuit, n’a pas de limites), gardez quand même en tête la limite de 25 sites, qui constitue son principal bémol. Mais avant d’y arriver, vous avez quand même du boulot ;-).

Et par rapport aux solutions concurrentes présentes sur le marché, ça donne quoi ?

• ThemeForest : la plupart des thèmes vendus sur la plateforme coûtent en moyenne autour de 59 $ (environ 49 €). Ils ne sont pas toujours utilisables sur un nombre de sites illimité et comprennent 6 mois de support.
• GeneratePress : il vous coûtera 59 $ (environ 49 €) pour une utilisation sur un nombre de sites illimités.
• Astra : les prix du thème créé par Brainstorm Force démarrent à partir de 59 $ (environ 49 €) pour une utilisation sur un nombre de sites illimités.
• Genesis : le framework en lui-même coûte 59,95 $ (environ 49 €) mais vous devrez obligatoirement vous procurer un thème enfant (soit généralement un prix de 129,95 $ pour les 2, soit environ 108 €). Par contre, le support et les mises à jour sont comprises à vie et vous n’avez pas à renouveler votre thème.

Notre avis final

Points forts d’OceanWP

• La personnalisation du thème via l’Outil de personnalisation.
• La foultitude d’options présentes, alors que le thème est gratuit de base.
• OceanWP est rapide et performant, comme annoncé.
• Un thème respectueux des standards de code de WordPress et SEO friendly.
• Une documentation riche et claire. Dommage qu’elle soit uniquement accessible en anglais.
• Le support est plutôt réactif. C’est en tout cas ce qui est ressorti des recherches que j’ai pu mener.
• Le thème est régulièrement mis à jour et correctement maintenu.
• La compatibilité avec WooCommerce et les nombreuses options intégrées nativement à ce sujet.
• Le thème est très bien traduit en français (c’est rare), que ce soit sur le Tableau de bord de votre administration, ou sur l’Outil de personnalisation.
• La Licence à vie pour se procurer le thème une bonne fois pour toutes.
• L’assistant d’installation est bien fichu pour vous guider pas à pas lors de l’installation du thème.

Axes d’amélioration d’OceanWP

• Il y a tellement d’options de personnalisation qu’il n’est pas forcément évident de s’y retrouver au départ, surtout si vous débutez sur WordPress.
• L’extension Ocean Extra me paraît indispensable pour profiter de fonctionnalités additionnelles gratuitement (ex : personnaliser chaque type de contenu, activer/désactiver les scripts et styles etc.). Dommage qu’elle ne soit pas intégrée nativement au thème, même si OceanWP nous a précisé que c’était tout à fait volontaire. Ils ont préféré ne pas alourdir inutilement le thème en ajoutant des options dont leurs utilisateurs n’auront pas forcément besoin ou n’utiliseront pas.
• Plusieurs démos de sites proposent en option l’installation de plugins premium, si vous souhaitez que l’affichage corresponde en tout point à la démo visualisée. Sinon, vous risquez de vous retrouver avec du contenu en moins, comme expliqué au début de cet article.
• La documentation est uniquement accessible en anglais.
• On peut aussi regretter, même si on la comprend au vu des justifications du développeur, le remplacement d’une offre illimitée par une offre limitée à 25 sites.

OceanWP, pour qui ?

Comme vous avez pu le lire au début de cet article, Alex ne le conseillerait pas aux débutants en raison de ses nombreuses options au sein desquelles il est facile de se perdre. Un point de vue que je partage, après ce test.

En revanche, si vous êtes un utilisateur confirmé et créez des sites régulièrement, je pense qu’OceanWP vous séduira. Déjà, il dispose de très nombreux hooks pour être personnalisé, ce qui le rend flexible et modulable.

Devenez un freelance WordPress accompli

Trouvez les bons clients, vendez des sites rentables, et libérez-vous de vos contraintes​

Découvrir la formation

Ensuite, pour un thème gratuit (avec des addons premium), il est quand même incroyablement riche en options.

Comme l’a affirmé Nicolas Lecocq en commentaire de la vidéo qu’Alex a consacrée au thème, « au début, il faut un petit temps d’adaptation car il y a beaucoup d’options. Je veux laisser beaucoup de choix aux utilisateurs. Une fois le thème pris en main, vous pouvez faire presque tout ce que vous voudrez ».

Enfin, si vous envisagez de créer une boutique WooCommerce, OceanWP sera un parfait compagnon. Vous apprécierez à coup sûr ses nombreuses fonctionnalités natives.

Hop, on sort la tête de l’eau

Et voilà, votre plongée dans OceanWP est terminée.

En résumé, je suis assez partagé avec ce thème. D’un côté, il est vrai qu’il est extrêmement puissant, complet et flexible. C’est un excellent thème, c’est certain.

Mais de l’autre, je le trouve un peu confus, notamment en raison des multiples options qu’il propose. Des options qui permettent quand même de pousser la personnalisation très loin, c’est indéniable et un vrai plus, à condition d’avoir un minimum d’expérience avec WordPress.

Ayant testé GeneratePress et Astra avant lui, j’avais aussi de quoi établir un point de comparaison, étant donné que ce sont 3 thèmes assez similaires.

Résultat : j’ai trouvé Astra, et dans une moindre mesure GeneratePress, plus accessibles pour des débutants.

Si la version Premium d’OceanWP vous botte, vous pouvez vous la procurer sur le site officiel via le bouton ci-dessous :

Maintenant, la parole est à vous.

Utilisez-vous OceanWP ? Avez-vous des remarques à ajouter à notre test ?

Dites-moi tout dans les commentaires.

Recevez gratuitement les prochains articles et accédez à des ressources exclusives. Plus de 40000 personnes l'ont fait, pourquoi pas vous ?

Je m'inscris

À propos de l'auteur

Thibaut (WPMarmite)

Content manager et copywriter indépendant, j’aide mes clients à développer leur présence en ligne en leur apportant des leads de qualité, grâce à des écrits percutants. Freelance depuis 2011 et ancien journaliste sportif, je suis passionné côté pro par le webmarketing, WordPress et le SEO. Côté perso, j'adore le sport, les séries TV et la lecture. Signes distinctifs : vient de la planète Mars(eille) et se drogue au football.