Add on to code to create caption button

Site URL: https://apple-wedge-pywm.squarespace.com/

Hi, I already have this code for my site 

.meta .sqs-active-slide{opacity:15}
.collection-type-gallery.hide-meta .meta{bottom:40px;right:40px;background:none}.collection-type-gallery.hide-meta .meta .slide{max-height:600vh;max-height:-webkit-calc(600vh - 80px);max-height:calc(600vh - 80px)}.collection-type-gallery .meta .image-desc{color:#fff}.meta-hovered .sqs-active-slide,.meta-visible .sqs-active-slide,.meta-hovered:hover .sqs-active-slide{opacity:1 !important}.collection-type-gallery.gallery-controls-simple .meta #simpleControls{position:fixed;bottom:0;left:220px;padding:10px 0}
.collection-type-gallery.gallery-controls-simple .meta #simpleControls .prev-slide{display:inline-block;vertical-align:middle;padding-left:20px;background:url(http://static1.squarespace.com/static/55f8f7e9e4b065c11d2e4b1b/t/5645b38ee4b0ba265cdd44d7/1447408526688/ico-arrow-prev.png) no-repeat 0 5%;background-size:auto 100%}
.collection-type-gallery.gallery-controls-simple .meta #simpleControls .next-slide{display:inline-block;vertical-align:middle;padding-right:20px;background:url(http://static1.squarespace.com/static/55f8f7e9e4b065c11d2e4b1b/t/5645b3fbe4b014628275aabc/1447408635233/ico-arrow-next.png) no-repeat 100% 5%;background-size:auto 100%}
.collection-type-gallery.hide-meta .meta .thumbnail-toggle{position:fixed;bottom:0;left:350px;padding:10px 0 10px 20px;background:url(http://static1.squarespace.com/static/55f8f7e9e4b065c11d2e4b1b/t/5645ababe4b0ee452876c215/1447406507604/ico-thumbs.png) no-repeat 0 49%}
.collection-type-gallery.hide-meta .meta .image-desc{padding-bottom:10px}.collection-type-gallery.enable-gallery-thumbnails .overlay-controls.center-control{cursor:url(http://static1.squarespace.com/static/55f8f7e9e4b065c11d2e4b1b/t/564d8e4de4b0cc5a62e4309d/1447923277907/ico-thumbs-large.png),auto}.user-added-controls{font-family:"proxima-nova";font-size:12px;line-height:1.2;text-transform:uppercase;position:fixed;bottom:0;left:470px;z-index:15}.user-added-controls .fullscreen-toggle,.user-added-controls .share-toggle,.user-added-controls .caption-toggle{display:inline-block;padding:10px 0 10px 20px;margin-left:20px;vertical-align:middle;background-repeat:no-repeat;background-position:0 50%;cursor:pointer}.image-desc-toggle{display:none}.collection-type-gallery .overlay-controls.left-control{cursor:url(http://static1.squarespace.com/static/55f8f7e9e4b065c11d2e4b1b/t/5645b38ee4b0ba265cdd44d7/1447408526688/ico-arrow-prev.png),auto}

grid.loaded:after{opacity:0}.grid .thumb{width:calc(25% - 10px);margin-left:10px;margin-bottom:10px;opacity:0;-webkit-transition:opacity .3s;-o-transition:opacity .3s;transition:opacity .3s}.grid.loaded .thumb{opacity:1}.grid .thumb a{position:relative;display:block}.grid .thumb img{width:100%;height:auto}.grid .thumb .thumb-caption{position:static;bottom:0;left:0;right:0;padding:5px 14px;background:#000;opacity:.6;color:#fff;font-family:"futura-pt",sans-serif;font-size:20px;line-height:1.2;text-align:right;font-weight:300}
.collection-type-gallery .meta .thumbnail-toggle{position:absolute;bottom:0;left:350px;margin:0;padding:10px 0 10px 20px;background:url(http://static1.squarespace.com/static/55f8f7e9e4b065c11d2e4b1b/t/5645ababe4b0ee452876c215/1447406507604/ico-thumbs.png) no-repeat 0 49%}
.collection-type-gallery .meta{left:auto;width:auto;max-width:170px;z-index:9999;bottom:40px;right:40px;background:none}.collection-type-gallery .meta .slide{max-height:90vh;max-height:calc(100vh - 80px);overflow-x:hidden;overflow-y:auto;background:rgba(0,0,0,.6)}.collection-type-gallery .meta .image-desc{padding:15px 15px 10px}.collection-type-gallery #slideshow .slide{background-repeat:no-repeat;background-position:center center;-webkit-background-size:contain;background-size:contain}@media (min-width:801px){.sqs-gallery-design-stacked-slide.sqs-gallery-design-stacked-slide img.horizontal{width:100% !important;max-height:none !important}.sqs-gallery-design-stacked-slide.sqs-gallery-design-stacked-slide img.vertical{height:100% !important;max-width:none !important}}@media (max-width:1740px){.grid .thumb{width:calc(33.3% - 10px)}}@media (max-width:1377px){.grid .thumb{width:calc(50% - 10px)}}@media (max-width:1023px){.grid .thumb{width:calc(100% - 10px)}}@media only screen and (max-width:800px){.image-desc-toggle{font-size:20px;text-align:right;line-height:20px;padding:0 10px;display:block;cursor:pointer}#slideshowWrapper #slideshow .slide{position:relative !important;top:auto;left:auto;overflow:hidden}.collection-type-gallery #slideshow .slide .image-desc-mobile{opacity:0;position:absolute;top:0;bottom:20px;left:0;right:0;overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:10px 10px 1px;margin:0;background-color:rgba(0,0,0,.6);color:#fff;-webkit-transform:translatey(150%);transform:translatey(150%);-webkit-transition:opacity .4s ease,-webkit-transform .4s ease-in-out;transition:opacity .4s ease,transform .4s ease-in-out}.collection-type-gallery #slideshow .slide.show-image-desc .image-desc-mobile{opacity:1;-webkit-transform:translatey(0%);transform:translatey(0%)}.grid{opacity:1}.grid:after{display:none}.grid .thumb{width:100%;margin-left:0;opacity:1}}

I would like to make the caption on the site optional with button next to the navigation of show thumbnails that just says caption that will open the caption. Here is a screenshot. 

On 10/6/2021 at 6:06 AM, dcardelino said:

Site URL: https://apple-wedge-pywm.squarespace.com/

Hi, I already have this code for my site 

.meta .sqs-active-slide{opacity:15}
.collection-type-gallery.hide-meta .meta{bottom:40px;right:40px;background:none}.collection-type-gallery.hide-meta .meta .slide{max-height:600vh;max-height:-webkit-calc(600vh - 80px);max-height:calc(600vh - 80px)}.collection-type-gallery .meta .image-desc{color:#fff}.meta-hovered .sqs-active-slide,.meta-visible .sqs-active-slide,.meta-hovered:hover .sqs-active-slide{opacity:1 !important}.collection-type-gallery.gallery-controls-simple .meta #simpleControls{position:fixed;bottom:0;left:220px;padding:10px 0}
.collection-type-gallery.gallery-controls-simple .meta #simpleControls .prev-slide{display:inline-block;vertical-align:middle;padding-left:20px;background:url(http://static1.squarespace.com/static/55f8f7e9e4b065c11d2e4b1b/t/5645b38ee4b0ba265cdd44d7/1447408526688/ico-arrow-prev.png) no-repeat 0 5%;background-size:auto 100%}
.collection-type-gallery.gallery-controls-simple .meta #simpleControls .next-slide{display:inline-block;vertical-align:middle;padding-right:20px;background:url(http://static1.squarespace.com/static/55f8f7e9e4b065c11d2e4b1b/t/5645b3fbe4b014628275aabc/1447408635233/ico-arrow-next.png) no-repeat 100% 5%;background-size:auto 100%}
.collection-type-gallery.hide-meta .meta .thumbnail-toggle{position:fixed;bottom:0;left:350px;padding:10px 0 10px 20px;background:url(http://static1.squarespace.com/static/55f8f7e9e4b065c11d2e4b1b/t/5645ababe4b0ee452876c215/1447406507604/ico-thumbs.png) no-repeat 0 49%}
.collection-type-gallery.hide-meta .meta .image-desc{padding-bottom:10px}.collection-type-gallery.enable-gallery-thumbnails .overlay-controls.center-control{cursor:url(http://static1.squarespace.com/static/55f8f7e9e4b065c11d2e4b1b/t/564d8e4de4b0cc5a62e4309d/1447923277907/ico-thumbs-large.png),auto}.user-added-controls{font-family:"proxima-nova";font-size:12px;line-height:1.2;text-transform:uppercase;position:fixed;bottom:0;left:470px;z-index:15}.user-added-controls .fullscreen-toggle,.user-added-controls .share-toggle,.user-added-controls .caption-toggle{display:inline-block;padding:10px 0 10px 20px;margin-left:20px;vertical-align:middle;background-repeat:no-repeat;background-position:0 50%;cursor:pointer}.image-desc-toggle{display:none}.collection-type-gallery .overlay-controls.left-control{cursor:url(http://static1.squarespace.com/static/55f8f7e9e4b065c11d2e4b1b/t/5645b38ee4b0ba265cdd44d7/1447408526688/ico-arrow-prev.png),auto}

grid.loaded:after{opacity:0}.grid .thumb{width:calc(25% - 10px);margin-left:10px;margin-bottom:10px;opacity:0;-webkit-transition:opacity .3s;-o-transition:opacity .3s;transition:opacity .3s}.grid.loaded .thumb{opacity:1}.grid .thumb a{position:relative;display:block}.grid .thumb img{width:100%;height:auto}.grid .thumb .thumb-caption{position:static;bottom:0;left:0;right:0;padding:5px 14px;background:#000;opacity:.6;color:#fff;font-family:"futura-pt",sans-serif;font-size:20px;line-height:1.2;text-align:right;font-weight:300}
.collection-type-gallery .meta .thumbnail-toggle{position:absolute;bottom:0;left:350px;margin:0;padding:10px 0 10px 20px;background:url(http://static1.squarespace.com/static/55f8f7e9e4b065c11d2e4b1b/t/5645ababe4b0ee452876c215/1447406507604/ico-thumbs.png) no-repeat 0 49%}
.collection-type-gallery .meta{left:auto;width:auto;max-width:170px;z-index:9999;bottom:40px;right:40px;background:none}.collection-type-gallery .meta .slide{max-height:90vh;max-height:calc(100vh - 80px);overflow-x:hidden;overflow-y:auto;background:rgba(0,0,0,.6)}.collection-type-gallery .meta .image-desc{padding:15px 15px 10px}.collection-type-gallery #slideshow .slide{background-repeat:no-repeat;background-position:center center;-webkit-background-size:contain;background-size:contain}@media (min-width:801px){.sqs-gallery-design-stacked-slide.sqs-gallery-design-stacked-slide img.horizontal{width:100% !important;max-height:none !important}.sqs-gallery-design-stacked-slide.sqs-gallery-design-stacked-slide img.vertical{height:100% !important;max-width:none !important}}@media (max-width:1740px){.grid .thumb{width:calc(33.3% - 10px)}}@media (max-width:1377px){.grid .thumb{width:calc(50% - 10px)}}@media (max-width:1023px){.grid .thumb{width:calc(100% - 10px)}}@media only screen and (max-width:800px){.image-desc-toggle{font-size:20px;text-align:right;line-height:20px;padding:0 10px;display:block;cursor:pointer}#slideshowWrapper #slideshow .slide{position:relative !important;top:auto;left:auto;overflow:hidden}.collection-type-gallery #slideshow .slide .image-desc-mobile{opacity:0;position:absolute;top:0;bottom:20px;left:0;right:0;overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:10px 10px 1px;margin:0;background-color:rgba(0,0,0,.6);color:#fff;-webkit-transform:translatey(150%);transform:translatey(150%);-webkit-transition:opacity .4s ease,-webkit-transform .4s ease-in-out;transition:opacity .4s ease,transform .4s ease-in-out}.collection-type-gallery #slideshow .slide.show-image-desc .image-desc-mobile{opacity:1;-webkit-transform:translatey(0%);transform:translatey(0%)}.grid{opacity:1}.grid:after{display:none}.grid .thumb{width:100%;margin-left:0;opacity:1}}

I would like to make the caption on the site optional with button next to the navigation of show thumbnails that just says caption that will open the caption. Here is a screenshot. 

 

Have you solved it yet?

It seems that your site has been expired and can not be access ed anymore