Jump to content

How do I create hide/show section of an entire page of text, images and or galleries in Squarespace (spoiler function/accordian/collapse)?

By Megalomaniac, in Customize with code

Go to solution Solved by Megalomaniac,

Recommended Posts

  • Replies 49
  • Views 35.3k
  • Created
  • Last Reply

Top Posters In This Topic

Popular Days

Top Posters In This Topic

Popular Days

Popular Posts

Megalomaniac
Megalomaniac

I'm trying to reduce my individual portfolio project pages to a few main images and the rest of the page that may contain additional text, galleries or images, to essentially hide unless prompted by t

  • 3 weeks later...
mandapop Level 1

mandapop

Posted
Posted

@Megalomaniac, can you pleeeeeease help meeee? Would love to know what I'm doing wrong. It's just for 8 image blocks with captions on a Page... I put the big code (along with ajax line) in Settings > Advanced > Code Injection... I put the button before the content.. I called it Show More and made it lead to #expand-8 ... I also tried lower numbers just to see... Nothing. Never worked at all. :(

http://MANDAMILLER.COM

Link to comment
  • 3 months later...
  • 3 months later...
dsfx1 Level 1

dsfx1

Posted
Posted (edited)

@Megalomaniac Megalo this is great and I have it working about 90%...

However I have an issue in that it works if you go directly to the page (www.ecke.audio/work or /work/) but when you navigate there from the homepage www.ecke.audio and click 'work' the menu is automatically open... if you refresh the page it works again but obviously defeats the object if it doesn't work at first time of asking.

Any help would be mega.

Thanks

Edited by dsfx1
Initial Revision
Link to comment
  • 2 weeks later...
  • 5 months later...
ricrra Level 1

ricrra

Posted
Posted

I'm also anxious to know if there's a version of this to create multiple expanding headers on the same page with different names. For example, my goal is to create:

Exhibitions (expand-1) - - > Event summary block

Bio (expand-1) - - > Text block

Publications - - > Gallery list summary block

News- - > Blog summary block

This is already working fine for me as long as all the buttons use the same name (show more/show less) but is there a way to duplicate the process with different button texts?

Link to comment
  • 9 months later...
NobleandThane Level 1

NobleandThane

Posted
Posted

Hi

I know this is an old thread but Im working on a page and want a Show More / Show Less button as quite frankly having all the information on the page at once is a bit overwhelming. I've tried everything above by @Megalomaniac which was really great, however I've come across one problem. When I first load the new page it shows all the information AND the button in the 'Show More' state. The button is inactive. When I refresh or reload the page it works perfectly. Showing a compressed page and a functioning 'Show More' / 'Show Less' page. Surely this must be an easy fix? I've tried different browsers and cleared history etc to see if that was causing the issue but no luck. It's worth pointing out that it's not just text on my page. It has a couple of image galleries and a further 'Enquire' button.

My site is www.NobleandThane.com however the page in question is hidden just now as it's a test page for a product that isn't ready to be published.

Any little tweaks or fixes would be gratefully received. It feels so close!!

Many thanks in advance. Jonny.

Link to comment
Guest

Guest

Posted
Posted

I'm having this exact same problem! Have you figured it out?

In the Squarespace Editor, it works perfectly. When accessed directly from the URL, it works perfectly. BUT, when you get to the page with a hyperlink, it shows everything expanded already and only a page refresh will make it function correctly.

I'll do some digging, but let me know if you figure it out!

@megalomaniac

Link to comment
Megalomaniac Level 5

Megalomaniac

Posted
  • Author
Posted

wow... I think i started a square space monster a long time ago!

SORRY, Ive been gone for a while everyone, working crazy hrs, but now I seem to have a lot of free time! Never even thought to look back here until i got an email the other day!

I must have spent hundreds of hours learning how to do some coding back then, and i profess that i am not a coder. but anything is possible i guess.

I truly forget a lot about what i learned back then, but recall that adding galleries and summaries were a problem, and also recall that no one had a solution, and i couldn't figure it out then.

Dedicated professional with 18 years of experience in Architectural + Interior Design and Urban Planning and with four years as an adjunct professor of Interior Design at Ringling College of Art + Design. Specializes in hospitality, entertainment, multi-family and mixed use architecture, interior design + planning. Expertise in programmatic design, conceptual design, design development, problem solving complex design scenarios, space + facility planning and urban and site development. Technical expert in BIM production, education + management, improving upon team workflow, efficiency, consistency, quality and confidence. Parametric modeling, 3D model coordination, 3D rendering and avid student of computational modeling. New to web development!

Link to comment
Megalomaniac Level 5

Megalomaniac

Posted
  • Author
Posted

Also if we look at the original post i spoke about, under exceptions, about Multiple injections on a page or index doesn't work. This was a big thing i found causes many issues.

Dedicated professional with 18 years of experience in Architectural + Interior Design and Urban Planning and with four years as an adjunct professor of Interior Design at Ringling College of Art + Design. Specializes in hospitality, entertainment, multi-family and mixed use architecture, interior design + planning. Expertise in programmatic design, conceptual design, design development, problem solving complex design scenarios, space + facility planning and urban and site development. Technical expert in BIM production, education + management, improving upon team workflow, efficiency, consistency, quality and confidence. Parametric modeling, 3D model coordination, 3D rendering and avid student of computational modeling. New to web development!

Link to comment
Megalomaniac Level 5

Megalomaniac

Posted
  • Author
Posted (edited)

What i can do is share with you all my site. And maybe you all can look at the code from the specific pages where i use the show hide, but i believe it is all the same as was posted years ago, which can be found under the resume section. Now, i know that, not everyone wants to produce the identical solution, as mine is much simpler and only contains text whereas some of you are looking to add a bit more to this, ie galleries, and i don't think the code has ever worked for that.

here is my site: www.anthonyashford.com

and the password to it is: confidential

Edited by Megalomaniac
Initial Revision

Dedicated professional with 18 years of experience in Architectural + Interior Design and Urban Planning and with four years as an adjunct professor of Interior Design at Ringling College of Art + Design. Specializes in hospitality, entertainment, multi-family and mixed use architecture, interior design + planning. Expertise in programmatic design, conceptual design, design development, problem solving complex design scenarios, space + facility planning and urban and site development. Technical expert in BIM production, education + management, improving upon team workflow, efficiency, consistency, quality and confidence. Parametric modeling, 3D model coordination, 3D rendering and avid student of computational modeling. New to web development!

Link to comment
Megalomaniac Level 5

Megalomaniac

Posted
  • Author
Posted

Maybe Stephen's @shrothermel post about the ajax scrolling is a good idea. i'd look into that.

Or maybe the solution that @logaritym provided in 2017 has better results for your needs.

I wish i could be more helpful, but today i'm a little behind on what i was doing back then. I feel i'd have to relearn it all over, and i just may have to as im getting ready to revamp my site with all new work and make it more "architecturally minimalist" in feel.

Dedicated professional with 18 years of experience in Architectural + Interior Design and Urban Planning and with four years as an adjunct professor of Interior Design at Ringling College of Art + Design. Specializes in hospitality, entertainment, multi-family and mixed use architecture, interior design + planning. Expertise in programmatic design, conceptual design, design development, problem solving complex design scenarios, space + facility planning and urban and site development. Technical expert in BIM production, education + management, improving upon team workflow, efficiency, consistency, quality and confidence. Parametric modeling, 3D model coordination, 3D rendering and avid student of computational modeling. New to web development!

Link to comment
Megalomaniac Level 5

Megalomaniac

Posted
  • Author
Posted

What i had to do was a lot of trial end error, and this is just what you all need to do, keep trying until you get it!

I wish you all the best and ill try to be more active on here in the future.

Dedicated professional with 18 years of experience in Architectural + Interior Design and Urban Planning and with four years as an adjunct professor of Interior Design at Ringling College of Art + Design. Specializes in hospitality, entertainment, multi-family and mixed use architecture, interior design + planning. Expertise in programmatic design, conceptual design, design development, problem solving complex design scenarios, space + facility planning and urban and site development. Technical expert in BIM production, education + management, improving upon team workflow, efficiency, consistency, quality and confidence. Parametric modeling, 3D model coordination, 3D rendering and avid student of computational modeling. New to web development!

Link to comment
Megalomaniac Level 5

Megalomaniac

Posted
  • Author
Posted

Very nice solution @logaritym !

Dedicated professional with 18 years of experience in Architectural + Interior Design and Urban Planning and with four years as an adjunct professor of Interior Design at Ringling College of Art + Design. Specializes in hospitality, entertainment, multi-family and mixed use architecture, interior design + planning. Expertise in programmatic design, conceptual design, design development, problem solving complex design scenarios, space + facility planning and urban and site development. Technical expert in BIM production, education + management, improving upon team workflow, efficiency, consistency, quality and confidence. Parametric modeling, 3D model coordination, 3D rendering and avid student of computational modeling. New to web development!

Link to comment
Megalomaniac Level 5

Megalomaniac

Posted
  • Author
Posted

@squarehnd - Im sorry, ive been very far removed from this all. I hope you were able to find a solution.

Dedicated professional with 18 years of experience in Architectural + Interior Design and Urban Planning and with four years as an adjunct professor of Interior Design at Ringling College of Art + Design. Specializes in hospitality, entertainment, multi-family and mixed use architecture, interior design + planning. Expertise in programmatic design, conceptual design, design development, problem solving complex design scenarios, space + facility planning and urban and site development. Technical expert in BIM production, education + management, improving upon team workflow, efficiency, consistency, quality and confidence. Parametric modeling, 3D model coordination, 3D rendering and avid student of computational modeling. New to web development!

Link to comment
Megalomaniac Level 5

Megalomaniac

Posted
  • Author
Posted

@mandapop - Im sorry, ive been very far removed from this all. I hope you were able to find a solution.

Dedicated professional with 18 years of experience in Architectural + Interior Design and Urban Planning and with four years as an adjunct professor of Interior Design at Ringling College of Art + Design. Specializes in hospitality, entertainment, multi-family and mixed use architecture, interior design + planning. Expertise in programmatic design, conceptual design, design development, problem solving complex design scenarios, space + facility planning and urban and site development. Technical expert in BIM production, education + management, improving upon team workflow, efficiency, consistency, quality and confidence. Parametric modeling, 3D model coordination, 3D rendering and avid student of computational modeling. New to web development!

Link to comment
Megalomaniac Level 5

Megalomaniac

Posted
  • Author
Posted

@Towns - Im sorry, ive been very far removed from this all. I hope you were able to find a solution.
Multi languages sounds like multi pages for each language or is their a way to convert all text into what ever language?

Dedicated professional with 18 years of experience in Architectural + Interior Design and Urban Planning and with four years as an adjunct professor of Interior Design at Ringling College of Art + Design. Specializes in hospitality, entertainment, multi-family and mixed use architecture, interior design + planning. Expertise in programmatic design, conceptual design, design development, problem solving complex design scenarios, space + facility planning and urban and site development. Technical expert in BIM production, education + management, improving upon team workflow, efficiency, consistency, quality and confidence. Parametric modeling, 3D model coordination, 3D rendering and avid student of computational modeling. New to web development!

Link to comment
Megalomaniac Level 5

Megalomaniac

Posted
  • Author
Posted

@ivy2015 - Im sorry, ive been very far removed from this all. I hope you were able to find a solution.

Dedicated professional with 18 years of experience in Architectural + Interior Design and Urban Planning and with four years as an adjunct professor of Interior Design at Ringling College of Art + Design. Specializes in hospitality, entertainment, multi-family and mixed use architecture, interior design + planning. Expertise in programmatic design, conceptual design, design development, problem solving complex design scenarios, space + facility planning and urban and site development. Technical expert in BIM production, education + management, improving upon team workflow, efficiency, consistency, quality and confidence. Parametric modeling, 3D model coordination, 3D rendering and avid student of computational modeling. New to web development!

Link to comment
  • 6 months later...
chrapm1 Level 1

chrapm1

Posted
Posted

is there a way to make this a "one-way" Show More button? to explain, i'm trying to have a Show More button that hides itself once you click it.

basically, it will show more like this code does but you won't be able to show less (unless you refresh the page, resetting the button)

Link to comment
  • 3 weeks later...
  • 7 months later...
  • 2 years later...

Create an account or sign in to comment

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

Sign Up / Login
Go to topic listing

News

×
×
  • 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