Jump to content

Trying to remove the # in the url slug for pages listed on an index page

Go to solution Solved by creedon,

Recommended Posts

So I am using the flatiron template for my photography website. I have an index page for my different albums of photos I will be featuring, but I have a problem with the page you are taken to when you click on a thumbnail for an album from the index page. For example, I have an album for Colorado. The custom slug is /colorado. When I type in [mywebsite].com/colorado, the photos and text are nicely aligned front and center. When I click on the album from the index page, it is aligned left, with an unaesthetic title and share button. This URL is [mywebsite].com/[indexpagename]#/colorado.

How can I get rid of that middle url slug when people click on the album covers? Any help is greatly appreciated!

https://www.davidgluhaich.com/

https://www.davidgluhaich.com/stills#/colorado/

https://www.davidgluhaich.com/colorado/

Link to comment
Quote

The custom slug is /colorado. When I type in [mywebsite].com/colorado

The way the URLs function is designed in to how the template functions. There are no settings to change that. Did you notice that the # format URL exposes navigation arrows so your site visitors can move between different projects? That feature is not available for the non # URLs.

If you want to hide the meta information on the # pages you can add the following to Design > Custom CSS.

#project .project-item > .meta {

  display : none;
  
  }

 

Edited by creedon

Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects.

Link to comment
12 hours ago, creedon said:

The way the URLs function is designed in to how the template functions. There are no settings to change that. Did you notice that the # format URL exposes navigation arrows so your site visitors can move between different projects? That feature is not available for the non # URLs.

If you want to hide the meta information on the # pages you can add the following to Design > Custom CSS.

#project .project-item > .meta {

  display : none;
  
  }

 

To be honest I could do without the navigation arrows. Don't really care for that feature. Do you know of a way to code it so that each project page is at least centered? Thanks for the response

Link to comment
  • Solution
Quote

Do you know of a way to code it so that each project page is at least centered?

Add the following to Design > Custom CSS.

#project .project-item .meta,
body.index-detail #navigator .switcher

  {
  
    display : none;
    
    }

#project .gallery {

  margin : auto;
  
  }

This is for v7.0 using the Flatiron template.

Let us know how it goes.

Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects.

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

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

Hire a Designer

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