Ajouter un url au logo

N’étant pas un programmeur, je procède par mimétisme pour modifier les skins. Cela a ses limites et donc j’aurais besoin d’un peu d’aide.

Je travaille sous myScenari.

Je désire associer mon logo dans le skin d’Opale au site d’accueil que j’ai généré avec OptimOffice, pour qu’en cliquant sur le logo, je retour à la page d’accueil dans la même fenêtre.

La page d’Opale est : Introduction [Énergie et turbines hydrauliques - Capsules théoriques]

Voici le code css que j’utilise :

body.default::before {
content: "";
background: #ffffff url("../img/tpl/logoSimTurb90.svg") no-repeat scroll 30px 3px / auto 60px;
height: 65px;
position: absolute;
left: 0;
right: 0;
top: 5px;
}

Présentement le logo n’est pas cliquable.

En cliquant j’aimerais que la page www.simturb.com apparaisse (il s’agit d’un renvoi vers : Accueil [Énergie et turbines hydrauliques] )

Quel est le code que je dois ajouter?

Vous remerciant à l’avance pour votre expertise.

Michel

Bonjour
Pour créer un logo cliquable cela ne me parait pas possible en css. Le mieux serait de passer par ScenariBuilder.
Une autre solution consisterait à ajouter le logo en javascript il serait ainsi possible de créer ce lien.
Sans avoir tester à mettre dans le skin.js :

scOnLoads[scOnLoads.length] = {
    onLoad: function () {
        const bd = dom.newBd(document.createDocumentFragment())
        bd.elt('img', 'logo').listen('click', () => {
            location.href = 'http://www.simturb.com/'
        }).att('src', '../skin/img/tpl/logoSimTurb90.svg').up()
        document.body.insertBefore(bd.current(), document.body.firstChild)
    }
}

et dans skin.css remplacer la déclaration

body.default::before {
content: "";
background: #ffffff url("../img/tpl/logoSimTurb90.svg") no-repeat scroll 30px 3px / auto 60px;
height: 65px;
position: absolute;
left: 0;
right: 0;
top: 5px;
}

par

img.logo {
height: 65px;
position: absolute;
left: 0;
right: 0;
top: 5px;
}

Cordialement,
Nicolas

1 J'aime

Ouf!! Je vais tester.
Merci beaucoup,
Michel

Bon. Dans Chrome, j’ai apporté les corrections de façon temporaire ainsi


et

Résultat, le logo est disparu et évidemment n’est pas cliquable.
Vous avez un avis?

Vous devez modifier et tester votre skin en local.
Le code JavaScript sera exécuté au chargement de la page pas une fois que la page est stabilisée.

Bonjour,
Merci, cela fonctionne avec une petite correction pour le js, que je laisse ici pour référence:

scOnLoads[scOnLoads.length] = {
onLoad: function () {
    const bd = dom.newBd(document.createDocumentFragment())
    bd.elt('img', 'logo').listen('click', () => {
        location.href = 'http://www.simturb.com/'
    }).att('src', '../skin/img/tpl/logoSimTurb90.svg').up()
    document.body.insertBefore(bd.current(), document.body.firstChild)
}

Il manquait le /skin.

Problème résolu!!

Ok merci, j’ai édité le post de @nicolas.boyer pour ajouter /skin car il est tagué comme solution.