top of page

Where did we get our pictures?

The images on this site are from several sources:

  • Pictures from St. Julie's taken by parishioners

  • Many of the pictures are from one of several websites, where they images are free for commercial use. (Be sure not to use the "sponsored" images which are not free to use.) Good sources of free images are:

    • Unsplash.com​

    • Pixabay.com

    • Pexels.com

    • FreeImages.com

  • To see the source of a specific picture, when editing the site click on the Settings gear for the image. The source is listed as part of the "What's in the image?"

    • Example: "What's in the image" is church2.jpg - St Julie photo (L Rozman). Here,  church2.jpg is the file name and St. Julie photo (L Rozman) tells the source.

    • Example:  "What's in the image" is respect-life.jpg pexels.com/photo/baby-sleeping-while-covered-white-coat-826734; here respect-life.jpg is the file name and pexels.com... is the web address of the source. ​

  • On the Adult Education page, because we've done these programs, the following seem reasonable to use:​

    • The pictures of the two nuns were just available online​. Leslie cropped them just to show faces.

    • Jon Leonetti is a publicity shot from his website

    • The Mary DVD is an advertising shot​ of the DVD

 

About Editing this Website

Notice the little curved arrows in the upper right, just before Save and Preview and Publish. They are for UNDO and REDO. 

 

If you change the header, navigation, or footer, it will change site-wide.

​

After you save and publish a change, remember to REFRESH the view of the website in your browser to see your changes.

​

THE ELEMENTS WE USED ARE:

Heading 1 - Used as the title in the body of each page

​

Heading 2 - rarely used in our site - we had a specific need for it a few places such as the section heading on the home page.

​

This subtitle is Heading 5 and is used within many pages as a title for Contact Info, etc.
​
This subtitle is Heading 6
​

This is a Paragraph 1 in the standard 16px size. We used this as our STANDARD for body text.

​

This is Paragraph 1 with an 18px font size. There's a lot of this on the site also.

​

This is a Paragraph 1 with a 19px font size. We used this for the in-body navigation for pages such as Sacraments, Liturgical Ministers, etc. We wanted that to be larger than Paragraph 1, but not bold.

 

The font used throughout the site is Signika. It's a clean, professional, unobtrusive font which is easy to read and does not call attention to itself. NOTE: Amy changed the font to Jura which is harder to read, especially on smartphones.

 

ABOUT NON-BREAKING DASH AND NON-BREAKING SPACE:

Because web pages render differently on different devices (different size monitors and tablets and phones), it is important not use the Enter key to start a new line to keep text together. It can look just fine on one screen and be a real mess on another, and the person doing the editing will never see the messy one and thinks everything looks great.

​

Instead, we use a non-breaking dash or non-breaking space. It is a nuisance, but it works consistently from device to device.

​

In order to have phone numbers not break across lines, instead of a regular hyphen, copy and paste this one (between the quotes): "‑"  

We replace every dash in every phone number throughout the website with the non-breaking dash.

​

The non-breaking space is used to keep two words together and not break across lines. Instead of using the space bar, use this one (between the quotes): " "

We replaced every space in St.[space]Julie and Fr.[space]George that we spotted with the non-breaking space. In websites, it is okay to have Fr. George on one line with his last name on the next; same with St. Julie on one one and Billiart on the next - we did not worry about those.

​

A demo of the reason not to use the Enter key follows. The Enter key was used before St. to start a new line. Now resize this box. Make it wider. See how the line changes way before the end of the box? Now make it narrower. Also changes in the wrong place. It only looks right in the original size. 

Blah blah blah blah blah blah blah blah blah blah blah blah

St. Julie Billiart blah blah blah

​

Compare it to the same text using the non-breaking space between St. and Julie, and just a regular space before St.  It keeps St. and Julie on the same line.

Blah blah blah blah blah blah blah blah blah blah blah blah St. Julie Billiart blah blah blah

BOXES

When adding a box, the color we've used is in the leftmost column of the color palette, second from the bottom. Its number is #787878.

Boxes are tricky. We've found it works best to make your text, then put a box around it. 

When you go back to edit the text, sometimes it's hard to "grab" the text. One way that works is to grab the BOX and move it out of the way. Edit the text, then put the box back where it belongs and resize it if needed.

It's really clunky, but it will work.

Another way that works is to make a blank line or two below the actual text, then place the box. That way, it's easier to grab the text because the container overlaps the box outline. I did that with this one. Go ahead and click just below the box and you'll see the blue outline around this text area.

​

bottom of page