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

Search the Community

Showing results for tags 'avenue'.

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • Forum
    • News and Announcements
    • Getting Started With Squarespace
    • Coding and Customization
    • Commerce
    • Selling & Scheduling Your Services
    • Feedback on Your Site
    • Images and Videos
    • Pages and Content
    • SEO and Marketing
    • Site Design and Styles
  • Colorado Designers's Topics
  • Squarespace Forum Club Guidelines's Topics
  • Austin, TX Designers's Club Discussion
  • New York City Designers's Club Discussion
  • Berlin Designers's Club Discussion
  • SEO Experts's Club Discussion
  • Photographers's Club Discussion
  • Graphic Designers's Topics
  • London Designers's Topics
  • Podcasters's Club Discussion
  • Custom Coding Help's Club Discussion
  • Atlanta, GA Designers's Topics
  • Seattle, WA Designers's Topics
  • San Diego, CA Designers's Topics
  • Dallas, TX Designers's Topics
  • Australia Designers's Club Discussion
  • Minnesota Designers's Topics
  • Minnesota Designers's Topics
  • Copywriters's Topics
  • France Designers πŸ‡«πŸ‡·'s Topics
  • France Designers πŸ‡«πŸ‡·'s Topics
  • Portland, OR Designers's Topics
  • Canadian Website Designers's Club Discussion
  • Los Angeles Designers & Devs's Club Discussion
  • South African Designers's Club Discussion
  • Brazil Designers's Club Discussion
  • Developers's Club Discussion

Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


About Me


Website


Location


Badges


Expert ID

  1. Site URL: https://www.horseshoeshandgrenades.studio/ I am using the Avenue family of themes and trying to have multiple grids based on categories via separate index pages. I'd like to be able to have the links in the grid go to the exact same child pages as the others and not create a duplicate page for each index, as that forces you to update each of the copy children when there are changes, which could get really redundant. Can this be done?
  2. Site URL: https://www.matthieulorrain.com/ Hi all! I am trying to implement a glitch effect on hover for my title. I have been using the following code but somehow it does not seem to work. "logo." seems to be the right selector, but the glitch effect is not functional for me in square space Any idea how to fix this? site: matthieulorrain.com template: avenue initial code in code pen: https://codepen.io/kkhenriquez/pen/PGvmjm CSS: .logo { &:before, &:after { display: block; content: attr(data-glitch); text-transform: uppercase; position: absolute; top: 0; left: 0; height: 100%; width: 100%; opacity: .8; } &:after { color: #f0f; z-index: -2; } &:before { color: #0ff; z-index: -1; } &:hover { &:before { animation: glitch .3s cubic-bezier(.25, .46, .45, .94) both 5 } &:after { animation: glitch .3s cubic-bezier(.25, .46, .45, .94) reverse both 5 } } } @media only screen and (max-width: 400px) { .glitch { font-size: 3em; } } @keyframes glitch { 0% { transform: translate(0) } 20% { transform: translate(-5px, 5px) } 40% { transform: translate(-5px, -5px) } 60% { transform: translate(5px, 5px) } 80% { transform: translate(5px, -5px) } to { transform: translate(0) } }
  3. Hello. In the Avenue template, we are given three different footer sections that stack: a page-specific footer, a site-wide footer, and social-links footer. So, All I want is a two column (full width) footer. It seems that I can add columns to the page-specific footer, but not the others. The spacing on this is massive (!) so I am trying to hide ( display: none; ) the site-wide footer and the social links footer. Problem is that for some reason, nothing I try seems to work! I'm really at my wit's end. Please halp!
  4. Site URL: https://www.everettfitch.tv/prints Hi there, I need help changing my product pages and subpages to a custom font. Here's the link: https://www.everettfitch.tv/prints https://www.everettfitch.tv/prints/wild-horses-no-23 And screenshots attached. I would like all the fonts to be the same. The incorrect fonts are the smaller font types under the pictures "from $100.00" , in the drop down menus under "size" and "quantity" as well as the add to cart font. Thanks! Everett
  5. Site URL: https://www.everettfitch.tv Hi there, I need help with my mobile menu. I use the Avenue Template. I have all the font changed on my mobile site except for the subfolder "Photography". Can you help me with this? Here's my website: https://www.everettfitch.tv I've also attached some screenshots. As you can see the only font that's different is "Photography" which is a folder. I need it changed to match the rest. Thanks, Everett
  6. Site URL: http://appalachianfineart.com I am going mad trying to figure out a CSS code that works to center JUST my footer in the Avenue template. I have already gone through most of this forum and tried other CSS snippets and none worked. I want the header to remain as-is, but the footer which contains my newsletter subscription box is squished to the left. I would like for it to be centered. Can anyone help??? Thanks so much!!! Jaime
  7. Site URL: https://griffinvothdp.com/film-photography Hey everyone! I'm hoping someone can help me as I've looked through the forum and can't seem to find an answer. Basically, I'm using avenue and have my indexes set up so that my galleries will display in rows of three, however it bugs me that when I have 4 galleries on an index page, the 4th is left aligned. I was wondering if anyone knows how I can get that 4th gallery to center align so that it's more aesthetic. Thank you :)
  8. Site URL: http://www.bensonellis.com/ I'm updating this website (http://www.bensonellis.com/) and made custom main navigation link icons in Photoshop. I'd like to replace the navigation links with the images using CSS. Help?
  9. Site URL: https://www.thejazzguitarsite.com/ I'm stumped on this one. I've searched every corner of the Squarespace forums and I've been trying to figure this out for the past couple hours. I've finally given up and came here! I would like to use the blog header content block when viewing the whole blog feed, but I would like to hide the header content when viewing an individual blog post. I know there are solutions that require CSS to be pasted in every single blog post but is there a universal fix that can be added to the sitewide custom CSS? For reference I am looking to hide the content block circled in red in the attached image.
  10. Site URL: http://hellololo.net Hello! I have a website made with the Avenue template ( http://hellololo.net ). What I would like to do is keep the background color for the pages the same except for the background color of my shop. I've been trying to insert codes here and there, but I'm clearly not doing a good job lol. Any help would be very appreciated~ Have a good one!
  11. Site URL: https://wrasse-rhombus-khz9.squarespace.com/config/pages Please help. I tried: #projectThumbs { display: none; } It works but it also hide the index images on the main page. I only want to hide it on the gallery pages where the thumbnails are at the bottom of the gallery pages. Thank you.
  12. Site URL: https://renerodlauer.com Hey guys! I hope you are all doing good and having a great start in the week. I just updated my website on the weekend and am very happy with how it looks on a PC or Mac, but, I really don't like two major things on my mobile version. I switched to the Avenue template and am happy with it but, even if I select "Thumbnails per row" to 1 - it will display two rows on mobile. Additionally the size of the thumbnails will get even smaller. Is there any possibility to attack these two factors with custom css? I would love to make my mobile site index page with all the projects look as closely as on Mac/PC and it really is just the placement of the thumbnails and their size, so I hope there is a way. Thank you very much! Attached you will find a screenshot of my website on Mac/pc and a screenshot of my website on mobile. Best, RenΓ©
  13. Site URL: https://www.kyestudio.co.uk/ Help please! My Index page is here 'about': https://www.kyestudio.co.uk/about When I click on the 'Sustainability' page from the image link in the bottom of the page it loads at the bottom of that page instead of the top. It is behaving like an anchor link but I can't seem to find how to edit it in this template. It doesn't happen every time and happens on the other pages sometimes as well 'Process' and 'Archive'. Thanks for any help. K
  14. I have built a site on the Avenue template, and cannot figure out why the social media icons are not showing up in the site footer. Based on the documentation, they should be in the lower right corner automatically, since I have the links in the social links panel of settings, and I do not have them hidden in the site styles. I'm at a loss here. Any suggestions for what I'm doing wrong? Sorry for the lack of link, but the client hasn't approved the build yet, so the site isn't live, but please see the screenshots for reference. Any help appreciated!
  15. Using Avenue with an Index page. Does anyone know how I find the url to a particular location inside the lightbox (not the thumbnail page)? Here's an explanation, with a non-squarespace site example at the end that does what I want. I use an index page for different portfolios. When someone clicks on the image to the portfolio they are interested in, they'll get a page with thumbnails for all the images in that portfolio. I currently have each thumbnail image initiate a Lightbox. I'd like to change this and have each thumbnail open a page. The page for that image would have these components: 1- A larger view of the image, with text below. 2- The thumbnails for that Portfolio below. I want the user to have two options: 1- Clicking on the large image on that page to launch the lightbox of all images in the selected portfolio (starting with that image), followed with the rest like any lightbox. 2- Clicking on a different thumbnail (below the main image on that page) starts the process over (the lightbox starting with the image of the selected thumbnail). Here's a nice page (not done in Squarespace) that shows the functionality, and the workflow I'm suggesting for squarespace. https://www.holdenluntz.com Workflow: Click on the menu item: Artist. The resulting page is like an Avenue Index showing Artists. It would be Portfolios in my case. If you then click on an Artist, it brings up a page with an image and text under it, and then thumbnails for the artist below. 1- If you click on the main image, you get a lightbox (starting with that image). 2- If you X out of the Lightbox, it brings you back to the page with the main image and the thumbnails below (which you can then select from). And the process continues. Hope this all makes sense. Anyone?
  16. Would appreciate info on how to increase the size of the thumbnails under the images in a slideshow. They are really small. Thanks.
  17. Site URL: http://www.brndnyn.com Hello- So I've been trying to change the transition time for my index titles that go over the images. I'm currently using Avenue as my template. As it is now, the hover makes the opaque color and text appear a little too quick- I'd like to change that to a slower fade in. However, none of the other code I could find for hover transitions worked for this template. I can't seem to find the tag that effects the title. I'm also trying to get my main title and navigation links to ease out when the mouse is no longer hovering, if that's possible. Would love any help! Thanks πŸ™‚
  18. Using Avenue, which I am happy with except for one thing. I am okay with the lightbox and mousing over the images to see the title and description on the desktop. But on mobile devices I'd really like the user to be able to pinch-zoom. I understand that this is not possible if I use the lightbox, but it occurred to me that a stacked view of the images would allow that (and coincidentally not require a tap on the mobile "dot" - which no one uses). However, I'd like the desktop version to continue to use the lightbox (with mouse-over for titles) and have the stacked version on the mobile devices (eg. iPhone, iPad). Question: if using an index in Avenue, can the images show up on desktop with the lightbox, but show up stacked on mobile devices? This would solve a lot of issues for a lot of people, I think. Appreciate the help!
  19. Site URL: http://www.neuronhub.com I'm going back to my portfolio and trying to build it from scratch after a couple of years. Previously I was only showing work which I directed and produced, but now I want to also include work which I had some other smaller roles in (editor / DOP etc.) My previous portoflio (neuornhub.com) used the Avenue index and I was able to simply create a different index for each category of work (accessible with a dropdown menu). For my new portfolio I want to be able to categorise by type of work but then allow users to select my role in the work (i.e. director, editor, DOP etc.). So that someone will be able to select 'comedy' as the category, and then select 'editor' to only see the comedy work which I edited. Is there any template which will allow this or is this one layer of too much complexity. Thanks so much!
  20. Site URL: https://myrandomviews.com/ I just thought it would be interesting if those of us who have a site built on Avenue would post a link here. It is one of the oldest Squarespace templates and it is also one of the most classy ones as well. It is also a lot more versatile than the demo reveals. How about I start: my random views derrick Lee parker
  21. I use avenue and want to keep the galleries in slideshow mode, I really don't like them stacked. Is there anyway I can open a gallery in slideshow mode from an index page? Thank you.
  22. Site URL: https://www.thislandisdigital.com/test-rectangles I've asked a less clear version of this question and wanted to try again with more clarity. The ideal solution would be flexible enough to be reapplied to achieve various similar arrangements. The immediate solution would strictly allow for the one requested arrangement. I am not amazing at CSS, so feel free to over-explain if you'd like. By default the Avenue template's indexes display a set of pages with identically proportioned thumbnails. In site styles, I can change the image ratio and every thumbnail will always occupy a single grid space. My current design uses square thumbnails (ratio 100, or 1:1) arranged in rows of 4 or, on mobile, rows of 2. In other words, I've created a perfect grid of squares. This design is largely inspired by ArtStation which sets a familiar standard in my industry. What I want is for the first two thumbnails to occupy two spaces in the grid for a ratio of 2:1. Because the rows for both desktop (4) and mobile (2) are divisible by 2, there is space for this in concept. Below are images of what I have and what I need. <<< Permission to stop reading here if you've already got an idea. Check images for reference. ⏰ So far I've been able to selectively target individual images and their backgrounds which I used to apply hover effects. I tried various methods of resizing images but often struggled with automatic vertical scaling (I'm looking for double wide with no change to height). Other attempts only scaled or skewed the image, leaving some part of the overall "thumbnail" structure at its original size. I don't know enough CSS to be able to understand that structure just yet. Below is the code I use to identify and affect particular thumbnails (modifying the "n" to a specific index). It's also how I'll assign rectangular hover images to the double-wide images. a.project:nth-child(n):hover { img { // On hovering over a specific block, affect the image at that selection. opacity: 20%; filter: blur(2px); transition: all 0.5s; } .content-fill { // On hovering over a specific block, affect the filled color at that selection. background-image: url(https://static1.squarespace.com/static/5338f2a1e4b012d5a0b4b9e7/t/5e852b782dc9304ac485f646/1585785720583/Thumbnails_HoverImage-Square_01.png); background-size: cover; //or: 100%; background-position: center center; background-repeat: no-repeat; } } I then tried to assign a {display: grid;} with grid-template-areas to an upper element on an index page. With this I successfully arranged the thumbnails as desired BUT had no control over vertical scaling. The double-wide thumbnails ended up appearing double-tall as well. My assumption here is that the width of the thumbnails was directly tied to the browser window (up to the maximum width), while the height had no obvious point of reference. Both my 1:1 thumbs and my 2:1 thumbs had a height of 512px, yet the height of each row was not identical. Instead, the images were locked to a 1:1 ratio, so if an image was assigned a width of two grid tiles, their height (while still one grid space tall) was doubled as well. I was able to rescale the image itself, but apparently not the entire container which stayed the same. I may have even been able to scale the grid space of each image at one point, but the clickable square and backgrounds and such were overlapping and jammed behind one another. Just lots and lots of weirdness. Below is some code for my attempts and a link to a page to test it. // Name the generic children of the layout in whatever order they appear. #collection-5c89d82aee6eb05083075575 #projectThumbs>div { a:nth-of-type(n){width: 100%;} a:nth-of-type(1){grid-area: one;} a:nth-of-type(2){grid-area: two;} a:nth-of-type(3){grid-area: three;} a:nth-of-type(4){grid-area: four;} a:nth-of-type(5){grid-area: five;} a:nth-of-type(6){grid-area: six;} a:nth-of-type(7){grid-area: seven;} a:nth-of-type(8){grid-area: eight;} a:nth-of-type(9){grid-area: nine;} a:nth-of-type(10){grid-area: ten;} a:nth-of-type(11){grid-area: eleven;} a:nth-of-type(12){grid-area: twelve;} a:nth-of-type(13){grid-area: thirteen;} a:nth-of-type(14){grid-area: fourteen;} a:nth-of-type(15){grid-area: fifteen;} a:nth-of-type(16){grid-area: sixteen;} } // Assign a grid display to the wrapper beneath #projectThumbs. #collection-5e83973d00d63d75669cbd19 #projectThumbs>div { display: grid; // Display the wrapper element as a grid. grid-template-areas: // CENTER ISLANDS "one one two two" // Two big "three four five six" // Four small "seven eight eight nine" //Small big small "ten eleven twelve thirteen" //Four small "fourteen fifteen fifteen sixteen"; // Small big small } // Customize the larger thumbnails. // At this point I was hopelessly lost, so this code is mostly to help isolate the specific indices needing double widths. #collection-5e83973d00d63d75669cbd19 #projectThumbs { a.project:nth-child(1) img, a.project:nth-child(2) img, a.project:nth-child(8) img { height: 50% !important; width: 100% !important; left: 0 !important; right: 0 !important; } a.project:nth-child(1), a.project:nth-child(2), a.project:nth-child(8){ height: 50% !important; width: 100% !important; } }
  23. Site URL: https://www.benblenner.com/ Hey, I'm struggling to add hover titles to my gallery thumbnails. There is an option to display the title below each thumbnail but I'd like the title of the project to become visible on rollover. Any ideas? I'm using Avenue. Thanks!
  24. Site URL: http://www.augury.me/ Hello! I would like the thumbnails of my index pages (Projects) all outlined in black to add contrast against the white background of the website. The template I am using is Avenue. Can anyone suggest how I may customize this template with code to put thin black borders around all of my project thumbnail images? Thanks in advance! Steph
  25. Hi I just completed my portfolio using the avenue template. I have turned off Marketing/Share Buttons & Pinterest Save Buttons but these are still appearing. Also the pin buttons do not even align over the relevant image. I am not using the 'Blog' or 'About' pages so have hidden these. I'm only using the 'Work' page. I have tried to search for all guides on this. One guide talked about Site Style tweeks but I cant find anything that relates to the pin button in the site style options I can see. I can only see COLORS, TYPOGRAPHY, SIZE VAlUES, INDEX STYLES, OPTIONS........ Please can you tell me what I am missing here???
Γ—
Γ—
  • Create New...