Headline Here







Headline Here

 

Headline Here


To create circle images, you first need to make your image dimensions “height” and “width”, the same size.  Most pictures are 1280 by 853.  You can make those pictures 853 by 853 right here in the WP Media Library.  Just select the image, click edit image, drag and click you mouse over the picture to create a square, type the dimensions in the image crop “section”, move your square crop over the part of the picture you want to use, and then hit crop button on the top left.  Make sure to save it.  In Cornerstone you can add an image element and choose circle.  This is also how you make a perfect square image.  To add the black border, you can go to the Custom Css editor and find the code for circle image.  You can change the color there, or you can add specific Css to each circle image in the style section of the element.  The Custom Css editor is a global page editor, meaning whatever code you type in there will reflect on your whole page (not your whole site).  For individual styles (colors, borders, etc,), use the style editor at the bottom of the element.  Each element you choose, has this option.

The square borders around the circle (at the bottom of the page) were created inside the element, in the column section,  Just add a border, a color, and the pixel width.  Make sure to add “mbn” (margin bottom none) in the image element under “class”.  You will see an example if you click on the image in Cornerstone, as we have already set it up for you.  Some Images and certain Header text automatically add margins for you.  If all else fails, keep in mind that you can add the class “mtn” and “mbn” to get rid of unwanted space above or below elements!