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

tuanphan

Circle Member
  • Posts

    31,957
  • Joined

  • Last visited

  • Days Won

    327

Posts posted by tuanphan

  1. On 9/27/2021 at 12:19 PM, L1NST3R said:

    Thanks for the response! For 2, the code works, but the menu (outside of the folder) is now too far up, not centered. Is there a way to only change the alignment of the folder content menu, and not the whole menu?

    image.png.89bf5b1c397bcbb77a32fae0dce81fed.pngimage.png.49cf0dfe5dd8c9392aa2e2f635141e6b.png

    For 3, the code only changed the position of the arrow, and the link text is still not aligned. 

    image.png.5cd192f722ff4099fefe5c9751f9ce5c.png

    #3. Can you explain in more detail? I thought you want to move arrow up?

  2. Add to Design > Custom CSS > Save & reload the site

    /* Resize Parallax Image - Text Mobile */
    @media screen and (max-width:640px) {
    body.homepage .Parallax-item img {
        width: 100% !important;
        height: auto !important;
        left: 0 !important;
        top: 0 !important;
    }
    body.homepage .Parallax-item figure {
        transform: unset !important;
    }
    /* in person */
    section#intro {
        min-height: unset !important;
        height: 180px;
    }
    section#intro h1 {
        font-size: 20px;
    }
    /* new to fencing */
    section#new {
        min-height: unset !important;
        height: 200px !important;
    }
    section#new h1 {
        font-size: 24px;
    }
    /* last section */
    section#join {
        min-height: unset !important;
        height: 180px;
    }
    }

     

  3. On 9/27/2021 at 11:37 AM, BradyAvenue said:

    This is AWESOME, thank you @tuanphan - how do I increase the font size of the captions/font of the captions? They are SO small by default.

    change this code

    .image-caption p {
        margin: 0 !important;
    }

    to this

    .image-caption p {
        margin: 0 !important;
    	font-size: 50px !important;
    	font-family: monospace;
    }

     

  4. On 9/27/2021 at 7:49 AM, jesswp said:

    Hey @tuanphan! Do you mind letting me know how to achieve the mobile block swap function below? I am looking to have image shows first, then the description + button.

    https://platinum-goldfish-ewl6.squarespace.com/treatments
    pass: skin

    In some other threads, I notice you use a single block ID to identify. How would this work in my case as there are multiple block ID (Title text block, line block, description text block and button block)

    Thanks so much!

    Add to Design > Custom CSS

    /* Treatments image text order mobile */
    @media screen and (max-width:767px) {
    div#block-yui_3_17_2_1_1632702196855_20283+.row {
        display: flex;
        flex-direction: column-reverse;
    }
    div#page-section-61510d58a101dd2018890fd2 .span-12>.row:nth-child(5) {
        display: flex;
        flex-direction: column-reverse;
    }
    div#page-section-61510d58a101dd2018890fd2 .span-12>.row:nth-child(7) {
        display: flex;
        flex-direction: column-reverse;
    }
    }

    Each section needs a different combination. It is very difficult to Explain. If you have a problem, just post it on the forum, we're always here to help.

  5. On 9/27/2021 at 2:54 AM, mheine said:

    Hey tuanphan - does this example require custom css? I would like to add a similar filter/search to a store 

    Hi. It requires CSS & Script code (need a Business Plan or higher).

    Use this Filter Plugin. You can create filter features, support both Gallery Page, Portfolio Page, Blog Page, Product Page, Summary Blocks. 

    You can also use it to add search, sorf by Price/Alphabetically,...

    Adadiamonds example.jpg

    1594359987795-PG8BJP2DFVBRRTQESZQW.thumb.jpg.172ea039717436f8d72023d5531da1dc.jpg

    If you need a simpler filter feature, use this plugin.

    Squarespace-Sort-by-Price-Plugin.png?format=750w

     

    and if you have no budget, you can message me, I can help you setup a simple filter feature (free).

     

  6. On 9/27/2021 at 2:46 AM, CoralDerfurt said:

    Hey, 

    I'm having the same issue, please could someone help me with a code for this gallery section on my site. It looks perfect on desktop but zooms in on mobile, I just want it to not zoom in. 

    Thanks,

    Coral

    Screenshot 2021-09-26 at 20.44.15.png

    IMG_4089.PNG

    Hi,

    Can you share site url? We can help easier

  7. On 9/27/2021 at 1:50 AM, karadia said:

    Hi! Here it is: https://www.aradia.io/checkout/order-confirmed?oid=6150c0c3c950045ccb55cda2&authCode=NjE1MGMwYzNjOTUwMDQ1Y2NiNTVjZGEyOjIwMjEtMDktMjZUMTg6NDk6MzkuMTc0WspeG2EZvEOlULp15jmWHK89r-nUZJXQuVLuWF4xh-fx


    I'd love to be able to customize the formatting here so it can make the rest of my beautiful site. Thank you!

    Can you setup a $0 product then share link? We can purchase it & access order confirmation page easier

  8. On 9/27/2021 at 1:45 AM, happyscone said:

    @tuanphan this worked, but the icons are not center on the screen. I tried a few different properties, but no success.

    Screen Shot 2021-09-26 at 11.43.56 AM.png

    Add this to Design > Custom CSS

    /* Mobile-center menu overlay icons */
    @media screen and (max-width:767px) {
    .header-menu-nav-folder.header-menu-nav-folder--active>div>div:nth-child(n+5) {
        position: relative;
        left: -6.5vw;
    }
    }

     

  9. Hi,

    #1. Mobile - https://www.falconsolutions.ca/digital-gallery

    Add to Design > Custom CSS > Save & reload the site to fix it

    /* resize gallery reel on mobile */
    @media screen and (max-width:767px) {
    .gallery-reel {
        height: 50vh !important;
    }
    }

    falconsolutions.ca-01-min.png

    #2. Tablet

    Add to Design > Custom CSS

    @media screen and (max-width:991px) and (min-width:768px) {
    div#block-c01eda114cb487cd941d [href*="/contact"] {
        white-space: nowrap !important;
    }
    }

    falconsolutions.ca-04-min.png

  10. 22 hours ago, SUN1992 said:

    Hi @tuanphan thank you so much for homepage it worked!! but I meant in the different categories, when you go to Shop > Dresses / Outerwear / Knitwear / Tops and Shirts / (and all the different categories) 

     

    Hi,

    I see no products in Outerwear / Knitwear. Can you check it again?

    With Tops & Shirts, use this CSS

    @media screen and (max-width:640px) {
    div#productList {
        display: grid;
        grid-template-columns: repeat(2,1fr) !important;
        grid-column-gap: 10px;
    }
    }

     

×
×
  • Create New...