Jump to content

Mettre mon menu à la vertical et footer transparent sur la page d'accueil


Recommended Posts

Bonjour, cela fait 3 jours que je me bas avec mon site : http://www.choupachou.com

Je souhaiterais dans un premier temps mettre mon footer en transparent car il bouffe une partie de mon arrière plan sur la page d'accueil

Ensuite j'aimerais changer l'apparence du panier pour l’aligner à côté de connexion/deconnexion

Pour finir, j'aimerais que les sous catégories de mon menu s'affichent à la vertical

 

Merci  :)

 

Link to comment
Share on other sites

En fait c'est vicieux ^^ ton footer est déjà transparent, c'est ton image qui est mal placé. Elle est actuellement dans div.columns-container qui lui ne va pas jusqu'en bas de bas. Place la dans le BODY et met un fond transparent pour le div#page.

Link to comment
Share on other sites

Bonjour,

Pour l'alignement de ton panier, il faut éditer le fichier :

http://www.choupachou.com/themes/default-bootstrap/css/modules/blockcart/blockcart.css

à la ligne 4, tu as :

#header .shopping_cart {
  float: right;
  padding-top: 50px;
  position: relative;
}

 

supprime le padding-top et ensuite tu peux ajouter :

top:-50 px;

right:-20px;

ce sont des exemples. A toi de jouer.

 

Regarde ce tuto pour apprendre comment repérer et modifier le code css d'élements :

https://www.prestashop.com/forums/topic/16736-tuto-installation-et-utilisation-de-firebug-pour-modifications-du-template-couleurs-images/

Edited by Vinum (see edit history)
Link to comment
Share on other sites

Oui, il est déjà transparent...c'est pour ça que je ne comprends pas en fait...

Par contre je n'ai pas compris comment procéder :/

 

Vinum, merci beaucoup, c'est possible maintenant de supprimer l'image et qu'il y ai juste panier comme à l'origine ?

Link to comment
Share on other sites

Oexo, cela ne fonctionne pas

 

footer-container {
  background-color: transparent; }
  @media (min-width: 768px) {
    .footer-container {
      background: transparent; }
  .footer-container .container {
   /* padding-bottom: 40px;*/ }
  .footer-container #footer {
    color: #777777; }
    .footer-container #footer .row {
      position: relative; }
    .footer-container #footer .footer-block {
      margin-top: 45px; }
      @media (max-width: 767px) {
        .footer-container #footer .footer-block {
          margin-top: 20px; } }
    .footer-container #footer a {
      color: #000000; }
      .footer-container #footer a:hover {
        color: white; }
    .footer-container #footer h4 {
      font: 600 18px/22px 'Helvetica Neue',Arial,'Liberation Sans',FreeSans,sans-serif;
      color: rgb(218, 17, 169);
      margin: 0 0 13px 0;
      cursor: pointer; }
      @media (max-width: 767px) {
        .footer-container #footer h4 {
          position: relative;
          margin-bottom: 0;
          padding-bottom: 13px; }
          .footer-container #footer h4:after {
            display: block;
            content: "\f055";
            font-family: "FontAwesome";
            position: absolute;
            right: 0;
            top: 1px; }
          .footer-container #footer h4.active:after {
            content: "\f056"; } }
      .footer-container #footer h4 a {
        color: white; }
    .footer-container #footer ul li {
      padding-bottom: 8px; }
      .footer-container #footer ul li a {
        font-weight: bolder;
        text-shadow: 0px 0px 0px rgba(0, 0, 0, 0.4); }
    .footer-container #footer #block_contact_infos {
      border-left: 1px solid #515151; }
      @media (max-width: 767px) {
        .footer-container #footer #block_contact_infos {
          border: none; } }
      .footer-container #footer #block_contact_infos > div {
        padding: 0 0 0 5px; }
        @media (max-width: 767px) {
          .footer-container #footer #block_contact_infos > div {
            padding-left: 0; } }
        .footer-container #footer #block_contact_infos > div ul li {
          padding: 0 0 7px 4px;
          overflow: hidden;
          line-height: 30px; }
          .footer-container #footer #block_contact_infos > div ul li > span,
          .footer-container #footer #block_contact_infos > div ul li > span a {
            color: white;
            font-weight: normal; }
          .footer-container #footer #block_contact_infos > div ul li i {
            font-size: 25px;
            width: 32px;
            text-align: center;
            padding-right: 12px;
            float: left;
            color: #908f8f; }
    .footer-container #footer .blockcategories_footer {
      clear: left; }
    .footer-container #footer #social_block {
      float: left;
      width: 50%;
      padding: 22px 15px 0 15px; }
      @media (max-width: 767px) {
        .footer-container #footer #social_block {
          width: 100%;
          float: left;
          padding-top: 5px; } }
      .footer-container #footer #social_block ul {
        float: right; }
        @media (max-width: 767px) {
          .footer-container #footer #social_block ul {
            float: none; } }
        .footer-container #footer #social_block ul li {
          float: left;
          width: 40px;
          text-align: center; }
          @media (min-width: 768px) and (max-width: 991px) {
            .footer-container #footer #social_block ul li {
              width: 30px; } }
          .footer-container #footer #social_block ul li a {
            display: inline-block;
            color: #0000CD;
            font-size: 28px; }
            @media (min-width: 768px) and (max-width: 991px) {
              .footer-container #footer #social_block ul li a {
                font-size: 20px; } }
            .footer-container #footer #social_block ul li a span {
              display: none; }
            .footer-container #footer #social_block ul li a:before {
              display: inline-block;
              font-family: "FontAwesome";
              vertical-align: -5px;
              font-weight: normal;
              -webkit-font-smoothing: antialiased;
              -moz-osx-font-smoothing: grayscale; }
            .footer-container #footer #social_block ul li a:hover {
              color: white; }
          .footer-container #footer #social_block ul li.facebook a:before {
            content: "\f09a"; }
          .footer-container #footer #social_block ul li.twitter a:before {
            content: "\f099"; }
          .footer-container #footer #social_block ul li.rss a:before {
            content: "\f09e"; }
          .footer-container #footer #social_block ul li.youtube a:before {
            content: "\f167"; }
          .footer-container #footer #social_block ul li.google-plus a:before {
            content: "\f0d5"; }
          .footer-container #footer #social_block ul li.pinterest a:before {
            content: "\f0d2"; }
      .footer-container #footer #social_block h4 {
        float: right;
        margin-bottom: 0;
        font-size: 21px;
        line-height: 25px;
        text-transform: none;
        padding: 0 10px 0 0; }
        @media (max-width: 767px) {
          .footer-container #footer #social_block h4 {
            display: none;
            text-align: center; } }
    .footer-container #footer .bottom-footer {
      position: absolute;
      bottom: -55px;
      left: 0; }
      .footer-container #footer .bottom-footer div {
        padding: 15px 0 0 0;
        border-top: 1px solid #515151;
        width: 100%; }
Link to comment
Share on other sites

Guest
This topic is now closed to further replies.
×
×
  • Create New...