How to Remove or Change an Icon Picture

For all changes to the 'Our Approach' icons...
Go to the 'Our Approach' Gallery under 'Unlinked Pages'

Adding a Picture

Click on the big "+" symbol in the right corner of the menu

Removing a Picture

Hover over the picture you want to remove.
Click on the  small "gear" symbol.
Go to the bottom of the window that pops up, and select 'Delete'.

Editing the Icon Text

Hover over the picture you want to remove.
Click on the  small "gear" symbol.
Change the "Title".


video Block
Double-click here to add a video by URL or embed code. Learn more.

How to Edit the Bullet Points

Make your browser window narrower until the 'Our Approach' icons disappear and you see the bullet points appear.

Then edit them like you would any other text. Just click on them.


Side Notes

The Advantages of Keeping 'Our Approach' icons in a Gallery

Keeping the icons in a gallery means that:

1. Squarespace will space them automatically for you - no dragging or dropping into a grid is necessary!

2. You can turn OFF all the icons at once

3. You can turn ON all the icons at once

The alternative is a lot of code that you have to touch whenever you add or change anything. Something like this: 


Troubleshooting

Problem: The Icons are Too Light

1. Go to the CSS Editor line 10 and look for 

.sqs-gallery-design-autogrid-slide img {

This should be the first line of code you see.
Then go down one more line. You should see:

opacity:0.25;

If you increase to 'opacity:1;' or just delete that line, then your icons should look exactly like what you upload into the corresponding gallery. 

Problem: The Icons Got Deleted

1. Add a new 'Summary Block' and choose the Gallery of icons that you want to display

2. Right click your browser and select 'Inspect Element'

For Safari:

For Chrome:

3. Hover over the new gallery block

Problem: Bullet Points Got Deleted

1. Make sure they actually got deleted. Check by making your browser window smaller. The bullet points will not appear unless your browser window is less than 520px wide. 

2. If the bullet points actually got deleted, follow the same steps above in  'Problem: The Icons Got Deleted'. The only difference is in Step 1: instead of making a new 'Summary Block' in step 1, just make a new Basic Text block. Make a new  list of bullet points and type in whatever you want. 

Problem: Delete the 'Our Approach' Icons!

So things change. You want to get rid of the 'Our Approach' icons.

1. Make sure to delete the Summary Block of icons AND the bullets. Delete the Summary Block as normal. Then, make your browser window less wide until the bullets show up. Delete the bullets as normal.
2. In the left-hand navigation menu, go to DESIGN > Custom CSS Changes and delete lines 24-29:

/* start: mobile devices */
@media only screen and (max-width:520px){ 
 /* This turns the bullets ON */
div#block-yui_3_17_2_2_1437789190574_7076 {
display:block!important;
margin-top:-50px; 
} 
 
 /*This turns the icons OFF*/
div#block-yui_3_17_2_29_1437779123131_11434.sqs-block.summary-v2-block.sqs-block-summary-v2{
display:none!important;
}
} /* end: mobile devices */ 

/* This turns the bullets OFF */ 
div#block-yui_3_17_2_2_1437789190574_7076 { display:none; }