Warning: Undefined array key "HTTP_ACCEPT_LANGUAGE" in /home/lmc77/sites/up310/plugins/content/up/upAction.php on line 2093

Deprecated: locale_accept_from_http(): Passing null to parameter #1 ($header) of type string is deprecated in /home/lmc77/sites/up310/plugins/content/up/upAction.php on line 2093

Warning: Undefined array key "HTTP_ACCEPT_LANGUAGE" in /home/lmc77/sites/up310/plugins/content/up/upAction.php on line 2093

Deprecated: locale_accept_from_http(): Passing null to parameter #1 ($header) of type string is deprecated in /home/lmc77/sites/up310/plugins/content/up/upAction.php on line 2093

Warning: Undefined array key "HTTP_ACCEPT_LANGUAGE" in /home/lmc77/sites/up310/plugins/content/up/upAction.php on line 2093

Deprecated: locale_accept_from_http(): Passing null to parameter #1 ($header) of type string is deprecated in /home/lmc77/sites/up310/plugins/content/up/upAction.php on line 2093

Warning: Undefined array key "HTTP_ACCEPT_LANGUAGE" in /home/lmc77/sites/up310/plugins/content/up/upAction.php on line 2093

Deprecated: locale_accept_from_http(): Passing null to parameter #1 ($header) of type string is deprecated in /home/lmc77/sites/up310/plugins/content/up/upAction.php on line 2093

Le widget Météo France sur votre site

🆙 meteo_france : affiche le widget de Météo France

Cliquer pour lire la documentation

Syntaxe : {up meteo-france=ville | orientation=sens}
le code commune de la ville à récupérer sur http://www.meteofrance.com/meteo-widget
@author: LOMART @version: UP-1.0 @license: GNU/GPLv3 @tags: Widget
  • meteo_france: le code commune de la ville à récupérer sur http://www.meteofrance.com/meteo-widget
  • orientation = v: bloc horizontal (H) ou vertical (V)
  • block (bloc) = p: balise HTML autour du module météo

Style CSS

  • id: Identifiant
  • class: classe(s) pour bloc parent
  • style: style inline pour bloc parent

IMPORTANT

Le script de Météo France fonctionnant d'une manière "aléatoire" et "imprévisible", je vous déconseille d'utiliser cette action. Elle est conservée pour l'historique de UP et, ne désepéront pas, dans le cas où elle deviendrait fiable.

En attendant, je vous propose des alternatives à la fin de cet article.

ce script permet d'afficher le widget de Météo France.

Basé sur une idée de Robert Gastaud (aka RobertG) - joomxtensions.com et une discussion sur le forum JOOMLA.FR. Merci à Yann Gomiero (aka Daneel) pour la correction du code

{up meteo-france=771860}

Dans sa forme la plus simple, il affiche le widget en vertical pour la ville dont le code insee (6 chiffres) est passé en paramètre.

Avec quelques paramètres

{up meteo=751010 | orientation=h | bloc=div | style=text-align:center}
meteo
le code commune insee à récupérer sur cette page : www.meteofrance.com/meteo-widget
orientation
horizontal ou vertical. Seule la première lettre est significative
bloc
balise HTML pour entourer le widget. P par défaut
class
classe(s) pour le bloc conteneur.
style
style personnalisé pour le bloc conteneur. Ici, on centre le widget

Le code commune insee peut aussi être trouvé sur le site www.galichon.com/codesgeo. Il faut le compléter avec des zéros pour avoir 6 chiffres.

Et le monde

Version 1.8 

Si le code de la commune est sur 5 chiffres, UP considère qu'il s'agit du code d'une ville non française. Le code est à récupérer sur cette page : www.meteofrance.com/meteo-widget

Exemple pour New-York :

LES ALTERNATIVES

Vous trouverez ci-dessous différentes méthodes pour ajouter un widget météo sur votre site. N'hésitez pas à proposer vos solutions.

Pour chacune des solutions, j'indique un exemple du code fourni par le site, sa traduction en shortcode UP (compatible wysiwyg)  et le rendu graphique.

meteored

Un widget météo pour une période de 1 à 7 jours facilement personnalisable (contenu, style, icônes et couleurs)

Code original

<div id="cont_9897f302cf88e664286d3616d2443d6f">
<script type="text/javascript" async src="https://www.theweather.com/wid_loader/9897f302cf88e664286d3616d2443d6f"></script>
</div>

Equivalent UP

{up div | id=cont_9897f302cf88e664286d3616d2443d6f}
{up html=script
| type=text/javascript
| async src=https://www.theweather.com/wid_loader/9897f302cf88e664286d3616d2443d6f
} {/up div}

Il est possible de récupérer une image à la place du script.

<img src="https://www.theweather.com/wimages/fotoa2608fbe777cb6903e87b4da747e0b67.png">
{up html=img | src=https://www.theweather.com/wimages/fotoa2608fbe777cb6903e87b4da747e0b67.png}

WeatherWidget.io

Un widget sans publicité pour une météo sur 1 à 7 jours. Il dispose de plusieurs options pour le personnaliser.

Code original

<a class="weatherwidget-io" href="https://forecast7.com/fr/48d862d35/paris/" data-label_1="PARIS" data-label_2="Météo" data-theme="original" >PARIS Météo</a>
<script>
!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src='https://weatherwidget.io/js/widget.min.js';fjs.parentNode.insertBefore(js,fjs);}}(document,'script','weatherwidget-io-js');
</script>

Equivalent UP

{up html=a
| class=weatherwidget-io
| href=https://forecast7.com/fr/48d862d35/paris/
| data-label_1=PARIS
| data-label_2=Météo
| data-theme=original}
PARIS Météo
{/up html} {up addscript=body}!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src='https://weatherwidget.io/js/widget.min.js';fjs.parentNode.insertBefore(js,fjs);}}(document,'script','weatherwidget-io-js');{/up addscript}

Attention à ne pas insérer de sauts de lignes dans le shortcode "addscript"


PARIS Météo

booked.net (version française)

Des grands widgets, des petits, des complets et des minimalistes, personnalisables sont disponibles. Plus d'info ICI

Code original

<!-- weather widget start -->
<a target="_blank" href="https://hotelmix.fr/weather/paris-18145">
<img src="https://w.bookcdn.com/weather/picture/3_18145_1_3_137AE9_250_ffffff_333333_08488D_1_ffffff_333333_0_6.png?scode=2&domid=581&anc_id=55937" alt="booked.net"/>
</a>
<!-- weather widget end -->

Equivalent UP

{up html=a
 | target=_blank
 | href=https://hotelmix.fr/weather/paris-18145
} {up html=img | src=https://w.bookcdn.com/weather/picture/3_18145_1_3_137AE9_250_ffffff_333333_08488D_1_ffffff_333333_0_6.png?scode=2&domid=581&anc_id=55937 | alt=booked.net} {up html} {up html}
booked.net

meteoblue

Un widget météo avec des prévisions sur 4 à 7 jours pour un lieu choisi ou pour l'emplacement du visiteur.

Beaucoup de possibilités à découvrir sur cette page : https://content.meteoblue.com/fr/modes-d-acces/widget

Ce widget est disponible en version "Prévisions par tranche de 3 heures", "Prévisions par jour" ou "synthetique"

Code original

<iframe src="https://www.meteoblue.com/en/weather/widget/three/paris_france_2988507?geoloc=fixed&nocurrent=0&noforecast=0&days=4&tempunit=CELSIUS&windunit=KILOMETER_PER_HOUR&layout=image"  frameborder="0" scrolling="NO" allowtransparency="true" sandbox="allow-same-origin allow-scripts allow-popups allow-popups-to-escape-sandbox" style="width: 460px; height: 593px">
</iframe>
<div><!-- DO NOT REMOVE THIS LINK -->
<a href="https://www.meteoblue.com/en/weather/week/paris_france_2988507?utm_source=weather_widget&utm_medium=linkus&utm_content=three&utm_campaign=Weather%2BWidget" target="_blank">
meteoblue
</a>
</div>

Equivalent UP

{up iframe=https://www.meteoblue.com/en/weather/widget/three/paris_france_2988507?geoloc=fixed&nocurrent=0&noforecast=0&days=4&tempunit=CELSIUS&windunit=KILOMETER_PER_HOUR&layout=image
 |  frameborder=0
 | scrolling=NO
 | allowtransparency=1
 | sandbox=allow-same-origin allow-scripts allow-popups allow-popups-to-escape-sandbox
 | style=width: 460px; height: 593px
} {up html=a | href=https://www.meteoblue.com/en/weather/week/paris_france_2988507?utm_source=weather_widget&utm_medium=linkus&utm_content=three&utm_campaign=Weather%2BWidget | target=_blank} meteoblue {/up html}

M6 météo

Code original

<div id="cont_UGFyaXN8NXwxfDN8MXxGRkZGRkZ8M3xGRkZGRkZ8Y3wx">
<div id="spa_UGFyaXN8NXwxfDN8MXxGRkZGRkZ8M3xGRkZGRkZ8Y3wx">
<a id="a_UGFyaXN8NXwxfDN8MXxGRkZGRkZ8M3xGRkZGRkZ8Y3wx" href="https://www.meteocity.com/france/paris_v75056/" target="_blank" style="color:#333;text-decoration:none;">
Météo Paris
</a> ©
<a href="https://www.meteocity.com">meteocity.com</a>
</div>
<script type="text/javascript" src="//widget.meteocity.com/js/UGFyaXN8NXwxfDN8MXxGRkZGRkZ8M3xGRkZGRkZ8Y3wx">
</script>
</div>

Equivalent UP

{up div | id=cont_UGFyaXN8NXwxfDN8MXxGRkZGRkZ8M3xGRkZGRkZ8Y3wx}
{up div | id=spa_UGFyaXN8NXwxfDN8MXxGRkZGRkZ8M3xGRkZGRkZ8Y3wx}
{up html=a | id=a_UGFyaXN8NXwxfDN8MXxGRkZGRkZ8M3xGRkZGRkZ8Y3wx
 | href=https://www.meteocity.com/france/paris_v75056/
 | target=_blank
 | style=color:#333;text-decoration:none;}Météo Paris{/up html}©{up html=a | href=https://www.meteocity.com}meteocity.com
{/up html}
{/up div}
{up html=script | type=text/javascript | src=//widget.meteocity.com/js/UGFyaXN8NXwxfDN8MXxGRkZGRkZ8M3xGRkZGRkZ8Y3wx}
{/up div}

Attention : on doit utiliser l'action html au lieu de addscript car il ne s'agit pas d'un fichier identifiable par son extension (.js)

 

 

Pour info, cette page utilise 29 action(s) :
upactionslist (1) div (4) meteo-france (3) flexbox (7) html (12) addscript (1) jcontent-info (1)