Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search

oxmoserecords

Member
  • Posts

    50
  • Joined

  • Last visited

Posts posted by oxmoserecords

  1. Thank you tuanphan
    I have attached a first screenshot. So the category "Orders" should be aligned with the question.
    On the second screenshot, as you see when you click on a question, it has some lines that surround the question (only on some browsers, such as Chrome, Safari). I would like to remove this. And then when the user open an answer, the last block of answer seen by the user will close to only display the last answer opened. Please let me know if something is still unclear ๐Ÿ™‚

    Screenshot 2020-05-05 at 19.02.05.png

    Screenshot 2020-05-05 at 19.02.58.png

  2. Thank you Tuanphan for your help ๐Ÿ™‚

    If I do not especially want to use the plugin. Do you know what code I should modify for having:
    -add "faq categories" between questions as simple title
    -align title of category with questionsโ€จ on left
    -when the user open an answer, the last block of answer seen by the user will close to only display the last opened
    -also on some browsers (such as chrome or safari, not mozilla) some line borders appears that surround the question we selected, I would like to remove it
    ย 

  3. Site URL: https://plum-octahedron-jxxd.squarespace.com/faq

    Hi everyone,

    I am creating a new website via Squarespace platform. The template is Heights.


    I have created a beautiful and simple FAQ accordion:
    https://plum-octahedron-jxxd.squarespace.com/faq
    Password to access is: 1234

    I would still like to improve it:


    -add "faq categories" between questions as simple title
    -align title of category with questionsโ€จ on left
    -when the user open an answer, the last block of answer seen by the user will close to only display the last opened
    -also on some browsers (such as chrome or safari, not mozilla) some line borders appears that surround the question we selected, I would like to remove it


    Thi is the code I have used to do it:
    ย 

    <h4 align="center">Orders</h4>
    <div style="visibility: hidden; position: absolute; width: 0px; height: 0px;">
      <svg xmlns="http://www.w3.org/2000/svg">
        <symbol viewBox="0 0 24 24" id="expand-more">
          <path d="M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z"/><path d="M0 0h24v24H0z" fill="none"/>
        </symbol>
        <symbol viewBox="0 0 24 24" id="close">
          <path d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"/><path d="M0 0h24v24H0z" fill="none"/>
        </symbol>
      </svg>
    </div>
    
    <details>
      <summary>
        How do I know if an item is in stock?
        <svg class="control-icon control-icon-expand" width="24" height="24" role="presentation"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#expand-more" /></svg>
        <svg class="control-icon control-icon-close" width="24" height="24" role="presentation"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#close" /></svg>
      </summary>
      <p>All products listed are in stock, and our online store is updated in real time to ensure that stock levels are as accurate as possible. Very occasionally, an item may be subject to a stock level error - if this occurs, we will e-mail you to notify you of the unavailable item, and you will not be charged for it.</p>
    </details>
    
    
    <details>
      <summary>
        How do I know you have received my order?    
        <svg class="control-icon control-icon-expand" width="24" height="24" role="presentation"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#expand-more" /></svg>
        <svg class="control-icon control-icon-close" width="24" height="24" role="presentation"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#close" /></svg>
      </summary>
      <p>
    You will receive an immediate e-mail confirmation of each order, stating the items ordered and the total cost, followed by a second mail within the next 24 hours when the order has been processed.</p>
    </details>
    
    <details>
      <summary>
        Can I add an item to an order I've already made?   
        <svg class="control-icon control-icon-expand" width="24" height="24" role="presentation"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#expand-more" /></svg>
        <svg class="control-icon control-icon-close" width="24" height="24" role="presentation"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#close" /></svg>
      </summary>
      <p>
    We are unfortunately unable to add items to existing orders.</p>
    </details>
    
     
     
    <style>body {
      font-family: "Helvetica Neue", sans-serif;
      background-color: rgba(0,0,0,.1);
    }
    
    h2 {
      margin: 20px auto 80px;
      font-size: 20px;
      font-weight: 600;
      text-align: center;
      letter-spacing: 2px;
      line-height: 1.5;
    }
    
    details {
      width: 75%;
      min-height: 5px;
      max-width: 700px;
      padding: 15px 80px 10px 45px;
      margin: 0 auto;
      position: relative;
      font-size: 20px;
      border: 0,5px solid rgba(0,0,0,.1);
      border-radius: 35px;
      box-sizing: border-box;
      transition: all .3s;
    }
    
    details + details {
      margin-top: 20px;
    }
    
    details[open] {
      min-height: 50px;
      background-color: #fcfcfc;
    }
    
    details p {
      color: #0d0c0c;
      font-weight: 400;
    }
    
    summary {
      display: flex;
      justify-content: space-between;
      align-items: center;
      font-weight: 500;
      cursor: pointer;
    }
    
    summary:focus {
      outline: none;
      box-shadow: 0 0 0 4px #f6f7f8, 0 0 0 5px black;
    }
    
    summary::-webkit-details-marker {
      display: none
    }
    
    .control-icon {
      fill: black;
      transition: .3s ease;
      pointer-events: none;
    }
    
    .control-icon-close {
      display: none;
    }
    
    details[open] .control-icon-close {
      display: initial;
      transition: .3s ease;
    }
    
    details[open] .control-icon-expand {
      display: none;
    }
    
    details[open] summary:hover::after {
      animation: pulse 1s ease;
    }
    
    @keyframes pulse {
      25% {
        transform: scale(1.1);
      }
      50% {
        transform: scale(1);
      }
      75% {
        transform: scale(1.1);
      }
      100% {
        transform: scale(1);
      }
    }</style>




    How I could do this? ๐Ÿ™‚

    Thanks a lot for your kind help!

    Screenshot 2020-04-26 at 10.06.56.png

  4. Site URL: https://plum-octahedron-jxxd.squarespace.com/catalogue

    Hi everyone,

    I am creating a new website via Squarespace platform. The template is Heights.

    https://plum-octahedron-jxxd.squarespace.com/catalogue
    Password to access is: 1234


    I would like to use a feature of Squarespace: "Promotional Pop Newsletter" for users to be able to subscribe to the newsletter.
    I have a footer with simple links. I would like when the user click on "newsletter" in the footer will have the box of "Promotional Pop Newsletter" that will display (please see attached).

    How I could do this?
    ๐Ÿ™‚

    Thanks a lot for your kind help!

    Screenshot 2020-04-26 at 08.44.18.png

  5. tuanphan,
    thanks again for your help!

    I have updated with the new code.
    You can see it here: https://plum-octahedron-jxxd.squarespace.com/catalogue
    Password is: 1234

    Can you please revert the old code?
    Now the "show less" mention is static at the same place after the paragraph, on the same line while it should go below the paragraph that appears, at the next line.

    + the following mentions should be simple text in bold / clickable - no there is not mouse cursor/pointer anymore to show that it's clickable.

    Read more โ†’
    โ† Close


    The best example to give you an idea is to make this look and feel and behavior of feature read more:
    www.oxmose.com/catalogueย 

    Please let me know if this is not clear ๐Ÿ™‚

  6. Site URL: https://plum-octahedron-jxxd.squarespace.com/

    Hi everyone,

    I am creating a new website via Squarespace platform. The template is Heights.

    https://plum-octahedron-jxxd.squarespace.com/
    Password to access is: 1234

    On our cover page, as you can see with this screenshot: https://ibb.co/RzFZ4Yr
    A button โ€œplayโ€ appears when we mouse hover below the text.
    Itโ€™s an error that might come from the cover page style that is made to host a video. However, I didnโ€™t upload any video on it. Only using text branding.


    How I could do this?

    Thanks a lot for your kind help!

ร—
ร—
  • Create New...