Cherche plugging d'intégration des informations de balise metéo

[Gilles Silberzahn]

Bon, je vois que personne n'a utilisé le widget.

Donc, je suis allé voir vos pages et je m'aperçois qu'elles sont en html. Or, pour que le widget fonctionne, il faut que les pages soient en php. C'est à peu près la même chose, mais pas tout à fait.
Dans une page "meteo.html", le code html sera interprété mais pas le code php.
Dans une page "meteo.php", les codes html et php seront interprétés (vous pouvez mixer les 2 codes)

J'ai un peu modifié les choses pour que vous puissiez vous en sortir.
Allez voir sur http://www.parapente-guyane.com/widgetbalise/instructions.php au chapitre des questions/réponses pour voir si vous trouvez une solution acceptable.

[lepiafvolant]

merci pour les explications mais pour moi , je dois foiré qq part et ça me saoule , autant j'peux passer des heures à monter des images vidéos etc etc , là j ai pas de patience , mais en tout cas , merci à toi de prendre le temps de t'être pencher sur le pb et d'essayer de nous trouver des soluces   

[Gilles Silberzahn]

Allez, un dernier essai, y'a pas plus simple que du copier-coller.

Tu copies-colles ça dans ta page sous "Un super site de meteo Rasp"  à la place de tes balises :

------------------------------------------------------------------------------------------------------------
<a href="http://www.balisemeteo.com/balise.php?idBalise=134" target="_blank"><img src="http://www.balisemeteo.com/graphs/graph_vent.php?idBalise=134" width="200" /></a><br />
Balise Ste victoire<br />
<a href="http://www.balisemeteo.com/balise.php?idBalise=90" target="_blank"><img src="http://www.balisemeteo.com/graphs/graph_vent.php?idBalise=90" width="200" /></a><br />
Balise Oraison<br />
<a href="http://www.balisemeteo.com/balise.php?idBalise=106" target="_blank"><img src="http://www.balisemeteo.com/graphs/graph_vent.php?idBalise=106" width="200" /></a><br />
Balise Signes<br />
<a href="http://www.balisemeteo.com/balise.php?idBalise=112" target="_blank"><img src="http://www.balisemeteo.com/graphs/graph_vent.php?idBalise=112" width="200" /></a><br />
Balise de Rustrel<br />
------------------------------------------------------------------------------------------------------------

Ça te donnera des images des 4 balises, qui renverront vers balisemeteo.com sur une nouvelle page si tu cliques dessus. La différence avec le widget, c'est que ça n'affiche pas les infos détaillées quand tu passes dessus avec la souris. un exemple de ce que tu retrouveras dans ta colonne de droite : http://www.parapente-guyane.com/widgetbalise/wb2.php

Si c'est trop étroit ou trop large, tu changes width="200" et tu mets ta valeur préférée en pixels.

Pour ajouter d'autres balises, tu suis le modèle :

------------------------------------------------------------------------------------------------------------
<a href="http://www.balisemeteo.com/balise.php?idBalise=XXX" target="_blank"><img src="http://www.balisemeteo.com/graphs/graph_vent.php?idBalise=XXX" width="YYY" /></a><br />
Nom de la balise<br />
------------------------------------------------------------------------------------------------------------

Avec
XXX : numéro de balise selon balisemeteo.com
YYY : largeur de l'image en pixels
Nom de la balise : Nom de la balise... mouarf

[lepiafvolant]

le top ;exactement ce que je cherchais   
t'es un champion , alors je te suis mega redevable avec tous ceux qui viennent checker les balises  sur notre site
donc    et  sans oublier 

le resultat mi colonne de droite
http://www.provencedelta.com/

un merci de la part des bâches à tube 

[Gilles Silberzahn]

le top ;exactement ce que je cherchais   
t'es un champion , alors je te suis mega redevable avec tous ceux qui viennent checker les balises  sur notre site
donc    et  sans oublier 

le resultat mi colonne de droite
http://www.provencedelta.com/

un merci de la part des bâches à tube 

Ravi que ça te plaise.

J'avais oublié qu'il n'y avait pas non plus de rafraichissement automatique en utilisant ce code. Si tu veux que les balises se mettent à jour automatiquement, repère la balise <head> qui doit être tout en haut de ta page html. Et entre cette balise et </head>, tu colles :
<meta http-equiv="Refresh" content="1200">

Le chiffre de 1200 est un temps en secondes. Ta page se rafraichira ainsi toute seule toutes les 1200/60=20 minutes, mais tu peux réduire ou augmenter ce chiffre comme tu veux. En phase de test, je le mets sur 10 secondes !!!

[lepiafvolant]

ça suffit amplement , si le lecteur veut plus d'info et de lisibilité , il suffit qu'il clique dessus
la fonction était de donner ou confirmer une tendance rapidement et c'est fait exactement comme on voulait 

encore merci pour le boulot car je sais que le résultat demande bcp de test, d'essai etc etc   
Si tu passes vers le coin de Salon de Provence , fais moi signe , on te doit une    meme une mega   
et crois moi , on a des ressources




Encore un grand merci 

[JC - MARSEILLE PARAPENTE]

le top ;exactement ce que je cherchais   
t'es un champion , alors je te suis mega redevable avec tous ceux qui viennent checker les balises  sur notre site
donc    et  sans oublier 

le resultat mi colonne de droite
http://www.provencedelta.com/

un merci de la part des bâches à tube 

Ravi que ça te plaise.

J'avais oublié qu'il n'y avait pas non plus de rafraichissement automatique en utilisant ce code. Si tu veux que les balises se mettent à jour automatiquement, repère la balise <head> qui doit être tout en haut de ta page html. Et entre cette balise et </head>, tu colles :
<meta http-equiv="Refresh" content="1200">

Le chiffre de 1200 est un temps en secondes. Ta page se rafraichira ainsi toute seule toutes les 1200/60=20 minutes, mais tu peux réduire ou augmenter ce chiffre comme tu veux. En phase de test, je le mets sur 10 secondes !!!

Salut Gilou, peux tu me dire comment les aligner au lieu de les avoir les un par dessus les autres ??

http://marseille-parapente.fr/meteo/

Bises

Jc

[Gilles Silberzahn]

Au dessus de chaque balise tu ajoutes :

Code:

<div align="center" style="float:left; position:relative">

et à la fin de chaque balise

Code:

</div>

[Gilles Silberzahn]

Ce qui donne au final pour chaque balise :
------------------------------------------------------------------------------------------------------------
<div align="center" style="float:left; position:relative; margin:5px">
<a href="http://www.balisemeteo.com/balise.php?idBalise=XXX" target="_blank">
<img src="http://www.balisemeteo.com/graphs/graph_vent.php?idBalise=XXX" width="YYY" /></a><br />
Nom de la balise<br />
</div>
------------------------------------------------------------------------------------------------------------

Avec
XXX : numéro de balise selon balisemeteo.com
YYY : largeur de l'image en pixels
Nom de la balise : Nom de la balise... mouarf

Et si tu veux le nom de la balise au-dessus du graphique, tu mets la ligne 4 entre la ligne 1 & 2.

[JC - MARSEILLE PARAPENTE]

Donc....

http://marseille-parapente.fr/meteo/

Super !!

et si je veux centrer le tout dans la page ??

Bises

[Gilles Silberzahn]

Pour obtenir ça ? http://www.parapente-guyane.com/widgetbalise/mp.html

Tu as juste une ligne à ajouter au dessus et en dessous des lignes qui commandent les balises. Et ça donne ça :


<div style="width:820px;">
    <div style=" float:left; position: relative; margin: 5px;" align="center">
    <h2><span style="color: #888888;">Balise Signes</span></h2>
    <p><a href="http://www.balisemeteo.com/balise.php?idBalise=106" target="_blank"><br />
    <img alt="" src="http://www.balisemeteo.com/graphs/graph_vent.php?idBalise=106" width="400" /></a></p>
    </div>
    <div style="float: left; position: relative; margin: 5px;" align="center">
    <h2><span style="color: #888888;">Balise Ste Victoire</span></h2>
    <p><a href="http://www.balisemeteo.com/balise.php?idBalise=134" target="_blank"><br />
    <img alt="" src="http://www.balisemeteo.com/graphs/graph_vent.php?idBalise=134" width="400" /></a></p>
    </div>
</div>

[Gilles Silberzahn]

Et si tu veux mettre les images en 350 pixels (c'est la taille originale de balisemeteo.com)

<div style="width:720px;">
    <div style=" float:left; position: relative; margin: 5px;" align="center">
    <h2><span style="color: #888888;">Balise Signes</span></h2>
    <p><a href="http://www.balisemeteo.com/balise.php?idBalise=106" target="_blank"><br />
    <img alt="" src="http://www.balisemeteo.com/graphs/graph_vent.php?idBalise=106" width="350" /></a></p>
    </div>
    <div style="float: left; position: relative; margin: 5px;" align="center">
    <h2><span style="color: #888888;">Balise Ste Victoire</span></h2>
    <p><a href="http://www.balisemeteo.com/balise.php?idBalise=134" target="_blank"><br />
    <img alt="" src="http://www.balisemeteo.com/graphs/graph_vent.php?idBalise=134" width="350" /></a></p>
    </div>
</div>

[JC - MARSEILLE PARAPENTE]

Trop fort....

VOLEUR !!!!!

Nan je déconne.

En revanche, j'ai ça qui n'apparait plus sur la page alors que c'est toujours présent dans l'éditeur :

</div>
<script type="text/javascript" src="http://widget.windguru.cz/js/wg_widget.php"></script><script type="text/javascript" language="JavaScript">// <![CDATA[
//              WgWidget({       s : 277240,       odh : 0,       doh : 24,       wj : 'kmh',       tj : 'c',       waj : 'm',       fhours : 72,       lng : 'fr',       params : [ 'WINDSPD', 'GUST', 'SMER', 'TMPE', 'CDC', 'APCPs' ],       first_row : true,       spotname : true,       first_row_minfo : true,       last_row : true,       lat_lon : true,       tz : true,       sun : true,       link_archive : false    }, 'wg_target_div_277240_42941746');
// ]]></script>
<div class="modif_meteo_box_wg"></div>

Tu vois la faute ??

[Gilles Silberzahn]

Non, pas vraiment, mais si tu fais tout bien comme sur le site windguru, tu remplaces ce que tu as écrit par :


</div>

<p>&nbsp;</p>
<div class="modif_meteo_box_wg">
    <p><script type="text/javascript" src="http://widget.windguru.cz/js/wg_widget.php"></script>
    <script type="text/javascript" language="JavaScript">
    //<![CDATA[
    WgWidget({
    s: 277240, odh: 0, doh: 24, wj: 'kmh', tj: 'c', waj: 'm', fhours: 72, lng: 'fr',
    params : [ 'WINDSPD', 'GUST', 'SMER', 'TMPE', 'CDC', 'APCPs' ],
    first_row : true,
    spotname : true,
    first_row_minfo : true,
    last_row : true,
    lat_lon : true,
    tz : true,
    sun : true,
    link_archive : false
    },
    'wg_target_div_277240_42941746'
    );
    //]]>
    </script></p>
    <div id="wg_target_div_277240_42941746"></div>
</div>

Et miracle, ça fonctionne... http://www.parapente-guyane.com/widgetbalise/mp.html

[Prismatique]

Bonjour Gilles !

Je souhaiterais pouvoir utiliser tes widgets balises dans mon site. Celui-ci est sur base Wordpress...

J'ai trouvé un plugin me permettant d'insérer un bout de code PHP, cependant cela ne semble pas fonctionner en copiant juste le code. I
il faut que les fichiers soient présents dans le dossier de la page comme expliqué, je suppose. Cependant, wordpress fonctionnant avec SQL, je n'ai pas de page html pour chaque contenu...

Saurai tu comment je peux m'en sortir dans ce cas ?

Sachant que je suis loin d'être programmeur. Juste bidouilleur averti avec Wordpress...

Merci d'avance !

[Gilles Silberzahn]

Dis-moi d'abord ce que tu veux faire : une page météo ou avoir un widget présent sur toutes tes pages (dans une sidebar ?)

Donne-moi l'adresse de ton site, éventuellement l'adresse de la page si tu as déjà testé le truc.

[Prismatique]

Merci de ton soutien !

Voici le lien vers une page d'exemple :  http://ride-and-cow.fr/ou-voler/basse-normandie.

Lorsque l'on approche le curseur sur une des balises, un pop-up apparait, avec les infos concernées. Pour le moment, Commes & Houlgate sont configurés avec un simple lien html vers l'image de la balise.

Je souhaiterais utiliser ton code pour avoir les "infos de survol", ainsi que les look différents...

Le contenu de ce pop-up se défini en html, en interne à Wordpress (à la manière d'une page ou d'un article). J'ai installé un plugin me permettant d'insérer du code PHP dans ces pages.

Cependant je ne sais ou placer les fichier du dossier "Widgetbalise" de ton pack dans mon install wordpress (Plugins ? ou autres ?) ni même lequel de mes fichiers "index.php" modifier. L'arborescence des répertoires n'étant pas basé sur un principe de dossiers par page...

Merci d'avance !


Off-Topic:

Merci encore de ton Acceuil en Guyane ! j'étais de passage sur 2 jours il y a 1 ans 1/2 au Rorota, j'y ai effectué parmi mes tous premiers plouf autonomes en ta compagnie et tu avais fait un biplace pour mon collègue ! Dédicace t'as été rendue dans une vidéo souvenir >>    
https://vimeo.com/66558880

[cypher]

Salut,

Je ressuscite ce fil de discussion
Il est devenu très facile (enfin pas très compliqué) de récupérer les infos d'une balise, maintenant que la FFVL et les Pioupious se mettent à l'openData.

En gros il faut faire une requête en geojson sur le flux proposé par le fournisseur, lui même en "JSON" (format de données).

    urlFFVL = "https://data.ffvl.fr/json/relevesmeteo.json";
    urlPioupiou = "https://api.pioupiou.fr/v1/live/all";
 
Puis de faire une requête sur le flux en question :
$.getJSON(urlFFVL) // appel en jQuery.

Si ça te parait trop compliqué, tu peux intégrer directement cette page en changeant les paramètres dans l'url (zoom/lat/lon).
via une iframe comme dans le code ci-dessous

<!-- exemple de code HTML affichant les balises rhône-alpes sur votre site -->
<iframe src="https://parapente-mexico.com/balise-ffvl/#8/45.300/3.194" width="100%" height="600"></iframe>

J'ai fait ça en quelques jours. N'hésite pas à farfouiller dans le code pour plus d'infos