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

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

Megalomaniac

Asked by Megalomaniac,

Question

Megalomaniac

Megalomaniac

Posted
Posted (edited)

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 the viewer. call it an accordion or a spoiler function or collapse, not best with terminology.

I started by looking at this thread, which has a simple and elegant approach for text only.http://answers.squarespace.com/questions/72321/how-do-i-create-hideshow-faqs-in-squarespace-collapsed-text

This is great for those circumstances, but I need it to include galleries and images or the like.

Does anyone know how this can be done or a variant of it that may also work?

Edited by chriscc
retag

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
  • Answers 48
  • Created
  • Last Reply

Top Posters For This Question

Popular Days

Top Posters For This Question

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

48 answers to this question

Recommended Posts

  • 0
mandapop

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
  • 0
dsfx1

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
  • 0
ricrra

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
  • 0
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
  • 0
Megalomaniac

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
  • 0
Megalomaniac

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
  • 0
Megalomaniac

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
  • 0
Megalomaniac

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
  • 0
Megalomaniac

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
  • 0
Megalomaniac

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
  • 0
Megalomaniac

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
  • 0
Megalomaniac

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
  • 0
Megalomaniac

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
  • 0
Megalomaniac

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
  • 0
chrapm1

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

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 question listing
×
×
  • Create New...

Support

Community

Developers

Resources