Welcome to ProPhoto! This guide provides some step by step instructions for getting started with your new ProPhoto site. For this reason, it may be helpful to have this tutorial open in one tab/window of your browser, and have your site open in a different tab/window. That way, you can easily follow along and complete each item in your own site.
Once you've worked through all of the steps here, the structure of your site should then be in place so that you can begin customizing the actual design of your site. (This guide doesn't provide any design steps, since every customer's goals for site design are different.)
When you signup for our services, we install WordPress and our ProPhoto theme for you.
Step 1 - Choosing/Importing/Installing your design
A design is a saved collection of ProPhoto customizations. If you purchased a design or told us which free design you wanted to start with, we will have installed that for you. And if migrating a site previously running ProPhoto 6 or ProPhoto 7 on another host, we would have migrated whatever was the live design. We are always happy to install any new design you purchase or even switch you to a different free design. But you can also do it yourself. This is done in "ProPhoto > Manage Designs."
You can select from any of the included designs shown here. Or, if you've purchased an add-on design from our store, you can upload that here to work on it. Our Create and Manage Designs tutorial provides more detailed information about this area of ProPhoto and how it all works.
Your initial Live Design (or Customizing Design if you're designing in private) will be one that we set up for you - a free design, a purchased one, or one we imported from your old site. If you'd like to try out any other free included design, you simply make a copy, save and set it to be the live or customizing design.
You can always come back to this screen to create new designs and switch which designs is your Live Design and which is your Customizing Design. So, when you come here for the first time, it may be a good idea to start customizing with a "test" design that you use to play around with ProPhoto and get more comfortable. Then, when you feel more comfortable with how it all works, you can simply return and create another design; one that you intend to actually use for live display.
Step 2 - Creating new content (if needed)
Before you begin designing your site, it's good to have a framework of some basic pages. The good news is that once you select your new design, all of the pages needed by the design should automatically be created for you by ProPhoto. In case you need any additional pages though, you can create them by going to the "Pages > All Pages" area in WordPress and simply clicking the Add New button. You don't have to worry about the actual content of each page right now, and of course you can create new pages at any point in the future too if you want. Generally, a good place to start is to think of all of the top-level menu links that you'd like on your site and create pages for each of those links that don't already exist. For example:
Step 3 - Assign the front page of your site
You get to choose what is shown on the front page of your site (a static page, or your blog posts). Any design you start with will have set you up with one or the other - normally a static page. But you can change from one to the other option, or change the page selected as the front and blog posts page. View your site and click the "Customize" link at the top to launch the ProPhoto Visual Builder. In the Visual Builder, go to the Layouts area and make your front page selection in the left-hand area.
It's likely that when you selected your design, this step was automatically taken care of for you. But it never hurts to go here and check the setting anyway. Our front page setup guide has more details about this if needed.
Step 4 - Assign design layouts to pages
Most of the ProPhoto designs (included and those sold separately) include specific layouts for specific pages. By default, when you select your design, ProPhoto will automatically assign the design's default layouts to the correct pages and page types for you. If you create additional pages on your own, these will receive a default layout. If you have any new pages to which you will want to assign custom layouts we recommend copying an existing layout then applying it to the page.
Step 5 - Social media setup
If you plan to use any of the social media options ProPhoto offers when you design your site, a good preliminary step is to link your various social media accounts with your site. You can address the actual social media functionality later, when you design your site. But by connecting your various social media accounts to your site now, it will make things easier when that time comes.
To do this, navigate to "Settings > Social Media" in the Visual Builder.
Here you can connect your site to the following accounts:
Additionally, if you plan on including any Pinterest functionality on your site, our Pinterest tutorial covers how to do all of that.
Link sharing thumbnails in social media
When you share a link to a page on your site the OpenGraph meta information is what determines the image and text snippet. ProPhoto automatically adds this information. But many other plugins do that, too, notably SEO plugins. If you are using a plugin like Yoast. All in One SEO or RankMath, we recommend using their OpenGraph implementation. You don't want duplicate meta information in the markup, so remove the ProPhoto version by checking this box
Step 6 - Various WordPress settings setup
There are some basic settings in your WordPress admin area that are worth visiting when setting up your site. They are:
-
Site Title/Tagline - Head to "Settings > General" in your WordPress admin area and enter a short title for your site in the Site Title field. This should be exactly your business name and nothing more. It should perfectly match your name in your Google Search/Maps profile. Similarly, in the Tagline field, enter a short description of your site. Typically this is no more then 160 characters and mentions your service and location.
Be careful not to stuff a ton of keywords since search engines can downgrade sites that do so. When you are done, just click the Save Changes button at the bottom. - Timezone - In the same "Settings > General" area, check the Timezone setting and make sure it is correct for your location.
-
Permalinks - Go to "Settings > Permalinks" to set up your sites permalinks as you'd like them to appear. We will chose "Post Name" by default, but you can change it. This is what controls how your site's URL slugs appear.
For example, say you have a page titled "About Me." With Plain permalink settings, the URL for the page may appear as:http://www.mysite.com/?p=123. With the Post name option selected, the URL would be:http://www.mysite.com/about-me. WordPress has a lot more detailed information about permalinks if you are interested.
Using the ProPhoto Visual builder to edit designs
This video gives a nice walk around the Visual Builder in ProPhoto.
The Basics
What is a page?
A "page" is a place where visitors can go on your website. WordPress has a "Pages > Add new" screen where you can create new pages with any title and address you want, along with content that you can display to the world.
Use a WordPress page for things like your front page, a blog page of posts, an investment page, a contact page, and lots more.
What is a design?
A "design" is a collection of all your ProPhoto 7 layouts, modules, and other settings that form the look of your site. Check out our Create and Manage Designs guide for more information.
What is a layout?
A "layout" comprises different blocks which can be filled with rows, columns, or modules that display items in a particular arrangement.
Layouts can be created for specific, individual pages. Or, the can be created for use on multiple pages/posts or different page types. Since the content area of each layout will be filled in by the page being visited, a layout can be created as generic as you like or can be filled with page-specific layout items.
A layout cannot be visited without a page, since it acts as a skin for a WordPress page.
See our Layouts tutorial for more information and screenshots.
How do I use the visual builder?
The Visual Builder is the main component in ProPhoto that you use to customize and design your site. It displays your site just as it will appear on the front end and allows you to edit any part of how it appears. You can add/edit/delete any items that are shown, as well as customize styling and appearance.
See our Visual Builder overview for more details on how to use this powerful too.
What is a block?
Blocks create the horizontal strips of your layout. They can have background images, be subdivided with multiple rows, and can be used in a single layout or repeated in multiple layouts.
Common uses for blocks might include:
- A "header" area of the layout, perhaps with a logo and a navigation menu.
- A section with a different background image/color than the adjacent sections.
- A section with different padding than the adjacent sections.
- The "page content" area of the layout which shows your blog posts or the content of the page to which you've applied the layout.
- The "footer" area of the layout where you could include social icons, links, address, or other items.
Since blocks can be subdivided with rows, you may find that a single block can contain lots of different things! But remember that entire blocks are reusable, so you may find that splitting things up into different blocks will help you reuse sections of a page layout to save work.
Our Visual Builder guide shows how you use blocks in ProPhoto .
What is a module?
A "module" is really just a thing - a widget - that you can add in your layout. Whether that is a photo, a gallery of photos, a grid linking to your pages/posts/galleries, a video, or a block of text, you'll add a module to your layout to create content that visitors see.
Modules will always "stack" vertically within the column where they are placed. If you need to modules to appear side-by-side, you can insert them into separate columns in your layout. (columns are created inside a row of any block) The exception is when you simply need images to appear side-by-side, since the graphics module can accept several images to appear in a horizontal strip.
A lot more about modules is available in our Modules help section.
Get help
If you get stuck, you can contact us for guidance - we're available by email during business hours.
Comments
0 comments
Article is closed for comments.