Coder mon site - j'ai besoin de votre aide !

nonolastar21 Messages postés 188 Date d'inscription Statut Membre Dernière intervention -
nonolastar21 Messages postés 188 Date d'inscription Statut Membre Dernière intervention - 29 nov. 2017 à 18:12

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

Afficher la suite

A voir également:

Coder mon site - j'ai besoin de votre aide !
Site de telechargement - Accueil - Outils
Site comme coco - Accueil - Réseaux sociaux
Quel site remplace coco - Accueil - Réseaux sociaux
Site de partage de photos - Guide
Site x - Guide

1 réponse

Réponse 1 / 1

jordane45 Messages postés 38486 Date d'inscription Statut Modérateur Dernière intervention 4 752

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 188 Date d'inscription Statut Membre Dernière intervention 3

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 188 Date d'inscription Statut Membre Dernière intervention 3

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.

Discussions similaires

Colis en cours de transport vers votre site de livraison ?

C'est quoi le site qui remplace coco chat

il est en cours de transport vers votre site de livraison

Votre réponse

Discussions similaires