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

peterbjerg

Circle Member
  • Content Count

    32
  • Joined

  • Last visited


Reputation Activity

  1. Like
    peterbjerg reacted to tuanphan in How do I set paragraph style in a Markdown Block?   
    use
    <p style="font-size:16px;color:red;">here your text</p> you can add more attribute to style, eg
    style="font-size:16px;color:red;text-align:center;font-family:mono-space;letter-spacing:1px;"
  2. Thanks
    peterbjerg reacted to tuanphan in Fixed AND transparent header/menu. How?? (SS 7.1)   
    try
    .tweak-fixed-header .header .header-announcement-bar-wrapper { background: transparent !important; }  
  3. Thanks
    peterbjerg reacted to tuanphan in Want different logo on homepage than all other pages   
    add !important to after
    background-image: url(https://static1.squarespace.com/static/5e3832dd5baacc6c9cad3ad6/t/5e7d04f045189a6da48c2121/1585251568273/Arena-logo-white.png) !important;
  4. Like
    peterbjerg reacted to brandon in How can I style image caption text only for select words?   
    Hi Peter. If you are referring to image caption/descriptions added using this code, then it's not currently possible. However, it is something I'd like to add. Perhaps I'll do that soon.
  5. Thanks
    peterbjerg reacted to brandon in Gallery Caption workarounds for 7.1? ROUND TWO   
    Hi @dan3.
    Looking at the underlying gallery code, it appears that image descriptions are in-the-works to one degree or another. In the mean time, I've created a bit of code you can use to add image descriptions/captions to gallery sections in Squarespace 7.1 .
    View Demo Site
    JavaScript
    Insert via sitewide footer code injection. If you only want to add descriptions to some (not all) galleries, pass your own CSS selector into addGalleryItemDescriptions() (for example: "section[data-section-id='5db1f73f7a30760db464bb02']") For images within a targeted gallery that you do not want a description to appear, you must enter a space as the description (otherwise the filename will show). <script> /** * Add descriptions/captions to galleries in Squarespace 7.1. * JavaScript * © @brandon (Squarespace Forum User) * This software is provided "as is", without warranty of any kind, express or implied. */ document.addEventListener("DOMContentLoaded", function() { addGalleryItemDescriptions(); function addGalleryItemDescriptions(gs, gdzs) { var a=['querySelectorAll','section.gallery-section,\x20.gallery-lightbox','length','[class*=\x27-item\x27]:not([class*=\x27item-\x27])','getElementsByTagName','img','alt','trim','createElement','div','className','gallery-item-description','textContent','appendChild'];var b=function(c,d){c=c-0x0;var e=a[c];return e;};(function(c,d){var e,f,g,h,i,j,k;e=document[b('0x0')](c?c:b('0x1'));i=e[b('0x2')];while(i--){f=e[i][b('0x0')](d?d:b('0x3'));j=f[b('0x2')];while(j--){g=f[j][b('0x4')](b('0x5'))[0x0][b('0x6')][b('0x7')]();if(g){h=document[b('0x8')](b('0x9'));h[b('0xa')]=b('0xb');h[b('0xc')]=g;f[j][b('0xd')](h);}}}}(gs,gdzs)); } }); </script>  
    CSS
    Insert in "Customer CSS", via the CSS Editor. The CSS below is very basic, adding a white box around the description and generally placing it at the bottom. You can customize to your heart's content. /** * Add descriptions/captions to galleries in Squarespace 7.1. * CSS * © @brandon (Squarespace Forum User) * This software is provided "as is", without warranty of any kind, express or implied. */ body { width: 100%; } section.gallery-section [class*='-item']:not([class*='-item-']):not([class*='-reel']):not([class*='-slideshow']) { position: relative; } .gallery-item-description { font-family: "Roboto", sans-serif; font-size: 16px; color: black; } .gallery-grid, .gallery-strips, .gallery-masonry, .gallery-reel, .gallery-fullscreen-slideshow { .gallery-item-description { position: absolute; width: 100%; bottom: 0; background-color: rgba(255, 255, 255, 0.7); padding: 2% 6%; box-sizing: border-box; } } .gallery-slideshow, .gallery-fullscreen-slideshow, .gallery-reel { .gallery-item-description { padding: 10px 25px; opacity: 1; transition: opacity 0.2s; } .gallery-slideshow-item:not([data-in="true"]), .gallery-fullscreen-slideshow-item:not([data-in="true"]), figure[style*="-9999"] { .gallery-item-description { opacity: 0; } } } .gallery-slideshow { .gallery-slideshow-list { min-height: 60vh; } .gallery-slideshow-item-wrapper, .gallery-item-description { flex: 1 1 auto; } } .gallery-reel { .gallery-item-description { text-align: center; left: 50%; transform: translateX(-50%); } &[data-width="inset"], &[data-width="inset"] { .gallery-item-description { max-width: 88vw; } } &[data-width="full-bleed"] { .gallery-item-description { max-width: 100vw; } } } .gallery-lightbox .gallery-item-description { margin-top: 1em; padding: 1em 2em; background-color: rgba(225, 225, 225, 1); } This is of course experimental. Do let me know how it works for you, or if you have questions.
    If you reply to this post, please do not quote the code in your reply. Doing so will create copies of the code which A) I would prefer not be copied and B) will propagate old versions of the code which are likely to fall out of date.
    -Brandon
  6. Thanks
    peterbjerg reacted to tuanphan in Fixed AND transparent header/menu. How?? (SS 7.1)   
    Add to Home > Design > Custom CSS
    .tweak-transparent-header:not(.header--menu-open) .header-announcement-bar-wrapper { background: transparent; }  
×
×
  • Create New...