Jump to content

Set up a new portfolio with a customized grid

Recommended Posts

Site URL: https://apricots-tunny-yy4c.squarespace.com/config/pages

I'm trying to create a new grid from a portfolio template. I would like to change its aspect ratio for each project (for example 4: 3 size or 2: 3 vertical size). This is not possible for me with the basic template. Is there a code to do all this?. if so, where should I enter it?. I'm attaching a photo of how I would like it to come. Also I was wondering how to add a subtitle to the overlay caption for each project (project name and client name). Thanks in advance.

 

https://apricots-tunny-yy4c.squarespace.com/config/pages

layout1.jpg

Link to comment
  • Replies 5
  • Views 465
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

Posted Images

On 5/7/2022 at 7:41 PM, gppp96 said:

Thanks for your reply. 

https://apricots-tunny-yy4c.squarespace.com/config/

password: Hiro96

I found this website. He made it but in 5 colums, I would need only 2 columns... https://www.jeremyodonnell.co.uk/

Example site is a template 7.0 version

You mean on this page? https://apricots-tunny-yy4c.squarespace.com/works-1

Have you tried changing to Gallery Masonry yet?

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
On 5/9/2022 at 10:11 PM, gppp96 said:

no, but im trying to substitute the portfolio page, with a image gallery with the overlay subtitle and a link attached to it. is it possible?

First, edit title to this

Screen+Shot+2022-03-15+at+1.47.00+AM.png?format=1000w

Next, add this code to Code Injection > Footer

<!--Add Jquery-->
<!-- Code by studiomesa.co -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>

<!--Portfolio Subtitle-->
<script>
$(function() {
var title = document.querySelectorAll('div.portfolio-text, .item-pagination-title');
for (var ss = 0; ss < title.length; ++ss) {
var item = title[ss];
var clientName = item.innerText.slice(0, item.innerText.indexOf('#'));
var clientDesc = item.innerText.slice(item.innerText.indexOf('#') + 1, item.innerText.length);
var newTitle = clientName + '</br><span>' + clientDesc + '</span>';    
item.innerHTML = item.innerText.replace(item.innerText, newTitle);
}});
</script>

If you use Personal Plan, follow this to add subtitle

https://forum.squarespace.com/topic/216655-share-portfolio-page-code-71/

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment

Create an account or sign in to comment

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


×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.