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


  • Posts

  • Joined

  • Last visited

Everything posted by IvanOB

  1. Thanks @tuanphan I used @bangank36 code for the desktop and some tips from another youtube video to tailor the nobile view as below, which works fine so far in my testing. Just finishing off my first blog so will get a couple of friends to test out before publishing to make sure the page works on different devices /* center blog google embedded map */ .sqs-block-content iframe { margin: 0 auto; display: block; width: 100%; } /* make blog google map size smaller on mobile screen*/ @media only screen and (max-width: 767px) { .sqs-block-content iframe { margin: 0 auto; display: block; width: 80%; height: 50vh!important; } }
  2. Thanks again bangank36, that works and i appreciate the fast reply
  3. Can i also check if there is a way to do this with one entry for all google maps rather than individually using their block ids? I can't work out the specific embed-block identifier to use.
  4. bangank36 thank very much for this. I have searching for the css for this for 2 days and this works perfectly.
  5. Site URL: https://www.ivanokyereboakye.com/landscape-street-urban-travel-stock-photography-gallery/america-west-coast Is there a way to dynamically set the width and height of images in Grid Masonry on desktop so landscape images fit to the available browser window space i.e. the full landscape or portrait image is visible in the browser area without scrolling up or down? When I launched my website about 3 months ago I couldn’t work out how to do that when using 1 column in Grid Masonry as portrait images in particular were oversized and only showing 2/3rds of the image in the browser area, so need to scroll down to see the rest. I therefore set it up with 2 columns as although not perfect it meant the portrait images were 90% visible on laptops and 100% on desktop monitor screens. At that time the mobile view was fine as would only show 1 image (not the 2 per row as on desktop) and the portrait ones were 100% visible. I have however seen over the last week that Squarespace appear to have changed things now so setting 2 columns on the desktop also shows as 2 columns on the mobile which is terrible. See this page as example https://www.ivanokyereboakye.com/landscape-street-urban-travel-stock-photography-gallery/america-west-coast I have temporarily set all other gallery pages (apart from the one above) to 1 column for now to keep the mobile view as single images per row, however need to find a way to reduce the desktop ones as the portrait images are too large. https://www.ivanokyereboakye.com/landscape-street-urban-travel-stock-photography-gallery/latest-update Ideally I would like to have it with 1 column on both desktop and mobile view, however if it is not possible to reduce the desktop width and height, is there a way to go back to my previous set up of 2 columns on the desktop but custom code the mobile view to only show 1 image per row? Thanks Ivan
  6. having same issue which happens when viewing using a mobile phone. However it doesn't happen when checking it on desktop using the mobile preview view
  7. wanted one for Alamy but fontawesome doesn't have it as one of their icons. Would you be able to show me so i know how to do either way for future: 1) how to insert a fontawesome icon using for example the flickr one (just so i know how to do it for next time) https://fontawesome.com/v4.7.0/icon/flickr 2) how to do using this created image https://static1.squarespace.com/static/5df7b9c2c15c2c1fc90f169e/5e493f3287b2ad50b4671632/5e4945ac96cdbe0b668d97c0/1581860294931/Alamy+logo_v1.0.png?format=500w thanks
  8. Hi Tuanphan my above email may give the wrong message as what I meant was that i had corrected the incorrect password so London2019 now works. I still need help with customising the generic social link icon. thanks
  9. Hi Tuanphan, yes used a combination of the below which may be longwinded but works fine Code injection for the portfolio pages <style> .sqs-block-html {margin-top:0.5vh; margin-bottom:0vh !important; } </style> <style> .portfolio-grid-overlay { padding-top: 1.0vw !important; } </style> <style> .page-section.vertical-alignment--top:not(.content-collection):not(.gallery-section):not(.section-height--custom).section-height--small>.content-wrapper { padding-bottom: 1vmax !important; } </style> Custom CSS for all pages /* decrease footer height */ .page-section[data-section-id="5e404b652c320258133c629c"] { min-height: 0vh !important; }
  10. Thanks. Site is https://purple-chinchilla-4bnr.squarespace.com/ and password London2019. Link is in the footer for each page. I haven't added the code yet. And if you can explain how to add the icon as well that would be great. Will look up how to use FontAwesome Icon as not come across that so far.
  11. Hi i have added a social link to my Alamy site on my website but it comes up with the generic squarespace link icon. I have found some mentions on the forum about being able to change the icon image with css and linking it to a flaticon but i can't see the actual css or process to follow, so would be grateful for some suggestions.
  12. hi yes i deleted all css code and then added back in and tweaked some things that i now can't remember but have it working fine now. I am just about to post a new question about customising the social link icon so if you can help that would be great as i saw your 25 Nov19 post but can't a previous solution on the forum
  13. Hi Brandon, thanks for the offer. In the end I decided not to include captions and keep it clean so i am ok now.
  14. I set up a portfolio page with a number of sub-projects within that, each sub-project page with gallery grid images. The images have spacing between them which has been working fine on desktop view and mobile view until i logged back in today to do some more work on the site. Now although the spacing between the images still shows on desktop, the mobile view has the images touching at the top and bottom with no space in-between. I have rechecked the CSS codes I have added to date and can't work out why but looks like i may have done something wrong yesterday. Help would be appreciated in getting the mobile view to work again. The site is https://purple-chinchilla-4bnr.squarespace.com/ and password Toronto2019 thanks
  15. in case the config weblink was showing it should be https://purple-chinchilla-4bnr.squarespace.com/ and password London0220
  16. Thanks Tuanphan. Tried the 1st css code and no difference as the page title section is still quite large (i've only tried the page title on the first America-East Coast page as wanted to see if i could get it to work before having it on all the other portfolio sub-pages. For (2) would want it on all pages except the homepage.
  17. Looking to reduce: 1) the padding/height of the page title section that is in-between the site header at the top and the galley image section (see America-East Coast page) 2) the padding between the bottom of the gallery image section and the footer Website is https://purple-chinchilla-4bnr.squarespace.com Password London0220 Help will be appreciated as can't seem to find the right solution as it's 7.1 and most of the advice out there is for older versions thanks
  18. Hi Brandon, have used your code with modified tweaks to have the 7.1 gallery grid masonry captions showing under the images without a coloured border. This works great with the images in the grid style and also when opened into the lightbox view as below. Problem I can't correct is that when the next or previous image is chosen in lightbox, the caption for the previous image still shows for 1/2 seconds overlapping with the caption for the current image. The only way i have managed to fix is by making a black box around the caption as shown below. This works ok but it would be neater if I could maintain the same clean style without a background colour border as on the grid files. Is there something you could suggest that would help do this? Thanks
  19. Hi have tried looking to see if there is a code already mentioned that i can use but can't see a response to help with my query. I am on version 7.1 and have set up a grid-masonry galley with landscape and portrait format images with inset width. I would like to reduce the width further but cannot find a way to do that. I am also having problems with the portrait format images appearing very large vertically with the whole image being higher than the screen size. This means only 2/3rds of the portrait image is visible at one time and you need to scroll down to see the bottom 1/3rd of the image (see attached photo of example). The html code for one of the portrait images from inspect is as below: <img data-src="https://static1.squarespace.com/static/5df7b9c2c15c2c1fc90f169e/5e0641c31aa65222ba975ea6/5e064206e2b52a3155f25a0b/1577574232104/okyiva_120101_5586.jpg" data-image="https://static1.squarespace.com/static/5df7b9c2c15c2c1fc90f169e/5e0641c31aa65222ba975ea6/5e064206e2b52a3155f25a0b/1577574232104/okyiva_120101_5586.jpg" data-image-dimensions="1667x2500" data-image-focal-point="0.5,0.5" alt="Elmina Castle, Elmina" data-load="false" style="width: 502px; height: 752px; object-position: 50% 50%; object-fit: cover;" data-parent-ratio="0.7" class="" data-image-resolution="2500w" src="https://static1.squarespace.com/static/5df7b9c2c15c2c1fc90f169e/5e0641c31aa65222ba975ea6/5e064206e2b52a3155f25a0b/1577574232104/okyiva_120101_5586.jpg?format=2500w" id="yui_3_17_2_1_1577661569410_1336"> Any suggestions on how i can control both the width (of landscape photos) and height of the portrait images? thanks in advance
  20. Hi i would like to show the image title as a caption under the individual images either in the Grid;Masonry or Simple Slideshow gallery styles (the latter also has thumbnails under the single main slide show image). However I hadnt realised before signing up that version 7.1 galleries dont show captions. Is there a way to add code that does this to specific galley pages rather than site wide? thanks
  • Create New...