Jump to content

DangDang

Member
 View Profile  See their activity

  • Posts

    24

  • Joined

  • Last visited

 Content Type 

Everything posted by DangDang

  1. DangDang
    @tuanphan I fixed it but not the way I wanted. I managed to make the header transparent on the front page and disable scrolling. However, on the sub-pages, the header is fixed but not transparent - ideally I would like it to be transparent (but still fixed) there as well! So if you have any ideas, please let me know!
  2. DangDang
    @Ziggy Wow, that was it! That piece of code was needed before but is actually redundant now. Thank you!
  3. DangDang
    These are my current settings, but I've tried playing around with these and the problem is that no matter what settings I choose, the grid starts a bit down in the footer, which is what makes the space between the footer and the section above it so big.
  4. DangDang
    I want to reduce the space before the footer on all of my pages. I tried several code snippets from similar threads but none of them have worked so far. Anyone knows if there is a specific case for my page? While editing, you can see that the section is quite spacious, and the grid doesn't start on top of the footer - meaning that I can't simply move the text upwards.
  5. DangDang
    Solved it! Finally found codes in old threads that works for both problems (transparency of header and invert burger menu on home page), thank you @tuanphan If anyone has a similar problem, here you go: Transparent header: header#header { background-color: transparent !important; } article section:first-child { padding-top: 0px !important; } White burger menu on homepage: body.homepage .burger-inner>div { background: white !important; }
  6. DangDang
    I'm trying to make my header transparent but can only manage to make it transparent lower on the page or when scrolling - when landing on the page or when page is scrolled to the top, the header is solid. See screenshots below, first one is on the homepage before scrolling, second one is the homepage after scrolling down. The second one is how I want it to be. The header is Fixed>Basic and with the following settings: With help from this forum, I managed to do this with the following code injected into the header settings of the homepage: <style> .page-section.gallery-section{padding-top:0px!important;} </style> However, that piece of code + the code for making the burger menu only works as injection, and I'm on the personal plan. Since I have no other reasons to switch to the business plan, I'm trying to find a way to do it with other means, only using settings and/or CSS. Any ideas?
  7. DangDang
    Yes, that's what I ended up doing! Switching the sections so the mobile version moved up into the header space, and added three rows in the top of the section
  8. DangDang
    @skycircle please let me know if you find a solution to this! I'm trying to do the same thing. Unfortunately the code from Ziggy's link doesn't work, as far as I understand that code is more about grid galleries than slideshow.
  9. DangDang
    I'm working on a site where I want different text sections to show depending on whether it's displayed on mobile or desktop. To achieve this, I use code from @tuanphan found on this forum: /* Hide this on Mobile */ @media screen and (max-width:767px) { section[data-section-id="65a90fba666ba066ad4a4ee9"]{ display: none; } } /* Hide this on Tablet - Desktop */ @media screen and (min-width:768px) { section[data-section-id="65a90ce4531574783e83ad15"] { display: none; } } In both cases, it works to hide one of the sections for the media format in case. However, on desktop, it also causes the text section to move up into the header space (see screenshots, the lower one is a reference for how the rest of the projects looks, which is how I want it) - something that hasn't been an issue before on the site. What might the problem be here? The mobile version looks good.
  10. DangDang
    That solved it! Exactly what i needed, thank you!
  11. DangDang
    @tuanphan I want it to be black (see attached image) like this on the overlay menu, as well as all pages except the home page: To summarize: The only place I want it to be inverted is the homepage, and the problem I currently have is that when I invert it on the home page, it becomes inverted on the overlay menu as well - when accessing the overlay menu from the home page. The logo is black when accessing the overlay menu from the other pages, but I want it to be black even when accessing the overlay menu from the home page.
  12. DangDang
    If it’s not possible to not invert the logo in the overlay menu, i guess a workaround might be to have another file as the logo only for the overlay menu. Then I can upload the black version and try to resize it to fit the normal header logo (which I upscaled in squarespace). Anyone have any suggestions for how to do this?
  13. DangDang
    @tuanphan thanks for the answer! Unfortunately, it had the opposite effect - with that code it looks like this when accessing the overlay menu from all pages (before, it was fine in all pages except the home page).
  14. DangDang
    I have a black logo on my website which I managed to invert to white on the home page, with help from other threads in this forum. Works great with the slideshow, the only problem is on the mobile version. When I access the burger menu (which is white) from the homepage, the logo looks weird/semi-transparent. If I access it from the other pages on the site, it's black, which looks better. See screenshots below The CSS code I used for inverting the logo on the homepage is the following: body[class*="home"] header#header img { filter: invert(1) !important; -webkit-filter: invert(1); }
  15. DangDang
    On my homepage, I have a slideshow with full bleed below a transparent header. I'm struggling with a code to make this header to stay fixed, but still keep the transparency. When I set it as fixed, the header background becomes white when scrolling. The header settings are set as Dynamic in Style, and fixed>basic. I tried adding the code from this thread, but it didn't work. Grateful for any help!
  16. DangDang
    I'm building a site with a portfolio section. On desktop, I have four images per row, but on mobile view it automatically switches to a "feed" with one image at a time/stacked on top of each other. I'm trying to adjust the CSS so that I can have at least three images per row even on mobile. Through the forum I found the following code, which works for 2 images per row. I'm now trying to adjust it to show three images per row instead. However, If I simply change the number "repeat(3,1fr);" it works, but the images differs in size (see screenshot) /* portfolio mobile */ @media screen and (max-width:767px) { div#gridThumbs { grid-template-columns: repeat(2,1fr); }} Any ideas? URL: https://caterpillar-parrotfish-m9mk.squarespace.com/all-work Password for site is AFLA
  17. DangDang
    Great! Thank you very much for your help!
  18. DangDang
    Thank you, that worked perfect! …and while we’re on the subject of classes, any idea what the class for the ”back” button in a burger menu item with subcategories might be? i managed to change the font for the burger items but can not find the class for the Back button (see screenshot) The CSS i used for changing the font for the other items: .header-menu-nav-folder-content .header-menu-nav-item-content { font-family: 'GravurCondensed-Light' !important; }
  19. DangDang
    I'm creating a site with a custom font. I've managed to apply the font for navigation and text etc, but I can't find the code for applying my font for portfolio titles, where I have it displayed in two different ways: - Below portfolio image (see Work > All Work) - As hover text (see Work - Architecture/Interior/Set design) Any ideas for what code to use in these examples? URL: https://caterpillar-parrotfish-m9mk.squarespace.com/ (password: AFLA)
  20. DangDang
    That worked! Thank you very much, looks great.
  21. DangDang
    Hm, it seems like I can't inert code specifically for the home page in the code injection section? Which means that if I inject your code for the header, it will affect all pages as well. Might this be because I'm still on the trial version?
  22. DangDang
    I'm currently working on a site where I want the homepage to have a full bleed slideshow on the whole page, but for the rest of the pages I want the header to be solid (that is, to be it's own section with white background) I've managed to make the homepage how I want it to be, but the problem is that I can't figure out how to make the other pages in a different way. Site: https://caterpillar-parrotfish-m9mk.squarespace.com/ (password: AFLA) The CSS I used to make the slideshow appear below the header was this: // SLIDESHOW GALLERY BEHIND HEADER NAV // .page-section.gallery-section{padding-top:0px!important;} Any ideas?
×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Upcoming Webinars →

Hire a Designer

Stand out online with the help of an experienced designer or developer.

Get Matched →

Support

Community

Developers

Resources