Coder mon site - j'ai besoin de votre aide ! [Fermé]

Signaler
Messages postés
186
Date d'inscription
mercredi 1 juillet 2009
Statut
Membre
Dernière intervention
2 septembre 2019
-
nonolastar21
Messages postés
186
Date d'inscription
mercredi 1 juillet 2009
Statut
Membre
Dernière intervention
2 septembre 2019
-
Bonjour,

je suis actuellement en train de travailler sur l'ouverture d'une boutique en ligne.
Je cherche à ajouter un bouton "Cliquer ici" qui redirige vers un lien.
J'ai réussi à créer mon bouton, à faire en sorte de renvoyer vers un lien.

Voici mon problème: le bouton fait que de bouger quand je zoom la page... de plus, le bouton est dupliqué sur toutes mes autres pages ... Je suis débutant en code HTML / CSS ... Si une âme charitable souhaiterais m'aider, c'est avec plaisir !

Si ma boutique marche, je lui ferais un don, promis !

merci d'avance

1 réponse

Messages postés
28012
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
3 avril 2020
2 230
Bonjour,

Tu fais ton site avec quoi ? Un cms ( genre pretashop, wordpress , autre ?? ) ?
Tu as codé ton bouton comment ? (montre ton code)

NB: Pour poster du code, merci d'utiliser le bouton prévu à cet effet : https://codes-sources.commentcamarche.net/faq/10686-le-nouveau-codes-sources-comment-ca-marche#balises-code

nonolastar21
Messages postés
186
Date d'inscription
mercredi 1 juillet 2009
Statut
Membre
Dernière intervention
2 septembre 2019
2
Déjà merci pour ta réponse. Ensuite, j'ai fait mon site avec Shopify.
Voici mon code:

<div data-section-id="{{ section.id }}" data-section-type="slideshow-section">

{% if section.blocks.size > 0 %}
<div class="slideshow-wrapper">
<button type="button" class="visually-hidden slideshow__pause" data-id="{{ section.id }}" aria-live="polite">
<span class="slideshow__pause-stop">
{% include 'icon-pause' %}
<span class="icon__fallback-text">{{ 'sections.slideshow.pause_slideshow' | t }}</span>
</span>
<span class="slideshow__pause-play">
{% include 'icon-play' %}
<span class="icon__fallback-text">{{ 'sections.slideshow.play_slideshow' | t }}</span>
</span>
</button>

<div class="slideshow slideshow--{{ section.settings.slideshow_height }}" id="Slideshow-{{ section.id }}" data-autoplay="{{ section.settings.autoplay }}" data-speed="{{ section.settings.autoplay_speed }}">
{% for block in section.blocks %}
{%- assign is_background_video = false -%}
{% if block.type == 'video' %}
{% if block.settings.video_type == 'background' or block.settings.video_type =='background-chrome' %}
{%- assign is_background_video = true -%}
{% endif %}
{% endif %}

<div class="slideshow__slide slideshow__slide--{{ block.id }}{% if is_background_video %} slideshow__slide--background-video{% endif %}" {{ block.shopify_attributes }}>
{% if block.settings.link != blank %}
<a href="{{ block.settings.link }}" class="slideshow__link">
{% endif %}

{% if block.type == 'video' %}
{% if block.settings.video_url != blank %}
<div class="video-loader"></div>
{% endif %}
{% unless block.settings.video_type == 'background' %}
<button type="button" class="text-link slideshow__video-control slideshow__video-control--close" data-controls="SlideshowVideo-{{ block.id }}">
{% include 'icon-close' %}
<span class="icon__fallback-text">{{ 'sections.slideshow.close_video' | t }}</span>
</button>
{% endunless %}
{% if block.settings.video_url != blank %}
<div id="SlideshowVideo-{{ block.id }}" class="slideshow__video {% if is_background_video %}slideshow__video--background{% endif %} slideshow__video--{{ block.settings.video_type }}"
data-id="{{ block.settings.video_url.id }}"
data-type="{{ block.settings.video_type }}"
data-slideshow="Slideshow-{{ section.id }}"></div>
{% endif %}
{% endif %}

{% if block.settings.image == blank %}
<div class="slideshow__image js">
<div class="placeholder-background">
{% capture current %}{% cycle 1, 2 %}{% endcapture %}
{{ 'lifestyle-' | append: current | placeholder_svg_tag: 'placeholder-svg' }}
</div>
</div>
{% else %}
<div class="slideshow__image box ratio-container lazyload{% unless forloop.first == true %} lazypreload{% endunless %} js"
data-bgset="{% include 'bgset', image: block.settings.image %}"
data-sizes="auto"
data-parent-fit="cover"
style="background-position: {{ block.settings.alignment }};{% if forloop.first == true %} background-image: url('{{ block.settings.image | img_url: '300x300' }});{% endif %}">
</div>
{% endif %}

<noscript>
<div class="slideshow__image"{% if block.settings.image %} style="background-image: url('{{ block.settings.image | img_url: '2048x' }}'); background-position: {{ block.settings.alignment }};"{% endif %}>
{% if block.settings.image == blank %}
<div class="placeholder-background">
{% capture current %}{% cycle 1, 2 %}{% endcapture %}
{{ 'lifestyle-' | append: current | placeholder_svg_tag: 'placeholder-svg' }}
</div>
{% endif %}
</div>
</noscript>
<div class="slideshow__text-wrap{% if block.settings.title != blank or block.settings.subheading != blank %} slideshow__overlay{% endif %}">
<div class="slideshow__text-content">
<div class="page-width">
{% unless block.settings.title == blank %}
<h2 class="h1 mega-title slideshow__title{% if settings.link != blank %} slideshow__title--has-link{% endif %}{% if section.settings.text_size == 'large' %} mega-title--large{% endif %}">
{{ block.settings.title | escape }}
</h2>
{% endunless %}
{% unless block.settings.subheading == blank %}
<span class="mega-subtitle slideshow__subtitle{% if section.settings.text_size == 'large' %} mega-subtitle--large{% endif %}">
{{ block.settings.subheading | escape }}
</span>
{% endunless %}
{% if block.type == 'video' %}
{% unless block.settings.video_type == 'background' %}
<div class="slideshow__video-control--play-wrapper{% if block.settings.title != blank or block.settings.subheading != blank %} slideshow__video-control--play-wrapper--push{% endif %}">
<button type="button" class="text-link slideshow__video-control slideshow__video-control--play" data-controls="SlideshowVideo-{{ block.id }}">
{% include 'icon-play-video' %}
<span class="icon__fallback-text">{{ 'sections.slideshow.play_video' | t }}</span>
</button>
</div>
{% endunless %}
{% endif %}
</div>
</div>
</div>

{% if block.settings.link != blank %}
</a>
{% endif %}
</div>
{% endfor %}
</div>
</div>
{% endif %}

{% if section.blocks.size == 0 %}
<div class="placeholder-noblocks">
{{ 'homepage.onboarding.no_content' | t }}
</div>
{% endif %}




</div>

<!-- Arnaud : Ajout btn en savoir plus -->
<a href="#arnaud-ancre-en-savoir-plus">
<div class="arnaud-btn-en-savoir-plus">

EN SAVOIR PLUS
</div>
</a>

<!-- EOS -->


++ CODE CSS

/************************************** AJOUTS & MODIFICATIONS *****************************************/

.arnaud-btn-en-savoir-plus{
position: relative;
background: #AAA369;
border: 1px solid #000000;
width: 300px;
text-align: center;
float: right;
margin: -350px 400px 0px 0px;
color:#555555;
font-family: flaming;
font-size: 20px;
border:none;
box-shadow:0px 3px 5px 0px #8D8758;
padding:15px 0 15px 0;
border-radius:8px;
font:bold 25px Arial;
color:#fff;

}

.arnaud-btn-en-savoir-plus:hover{
background: #ADA772;



}
nonolastar21
Messages postés
186
Date d'inscription
mercredi 1 juillet 2009
Statut
Membre
Dernière intervention
2 septembre 2019
2
Je précise !!! --> ce bouton permet l'effet ancrage. L'autre bouton qui redirige vers un lien, je l'ai supprimé. Mais le problème reste le même, mon bouton se balade n'importe où quand je bouge ma fenêtre.