Site Designer Gallery
The Site Designer Gallery is where you choose the design template you want to use for your site.
You'll then customize it in Site Designer.
If you want to customize the images used in your style (header image, and any background images for the Body, Page Wrapper, columns or Footer, you can download them all in one zipped package by clicking on this link (after you've selected your template and moved back to the Site Designer)...
https://sbiapps.sitesell.com/sitebuilder/blockbuilder/
transitiontemplate?type=package
You must be logged into your account to use this link. If you have more than one Solo Build It! site, you must have that one active (check the top right corner of any page for the domain name) in order to download the package for that site.
Category
- Click on a category to view the styles in that category. Or click on All to view all the designs in all the categories.
- Click on the 1-col, 2-col or 3-col button to view only the designs with the desired number of columns.
There are 10 categories of pre-designed styles, plus Custom. Click on the category most relevant to your niche to review the pre-designed styles in that category. The styles will then appear.
When you click on a category, its background changes color, to indicate that this is the current category.
Tip
-
Be sure to view the templates in all the categories. You might find a perfect fit in another category. And if you don't find the perfect design, customize one that comes close. Or create your own with a template from the Custom category.
Preview
The gallery uses mini-sites to preview what each design looks like (except for Custom). You'll see a real headline and a real first paragraph, followed by "ipsum lorem" text. Each of these sites is a real site. Depending on the design, you'll also see links to other pages that will give you a better sense of how the design will look as is.
- Hover over the design's thumbnail to view the live demo for that design, in either mobile or desktop.
- In the preview, select the other version by clicking on the device icon at the top center of the page.
- To return to the gallery, click on Back to design gallery on the far left side.
There are two different preview options for each design. You can view the design either mobile (the phone icon) or desktop (the computer icon).
Click on the one you want to preview. To switch to the other preview of the mini-site, click on its icon at the top of the preview page.
Click on Back to design gallery to go back to the gallery to view other designs.
Design Metadata
When you preview any design, you'll see the metadata for that design. Right next to the Select This Design button, you'll see the design's name, its layout width, the width of all the columns in the design, and any special features, such as Stripes (available only on some designs).
Note
The sum of the column widths will not equal the design's width. The column widths indicate the space available for you to use in each design.
For example, the Content Column width may be reported as 980px in a template that's 1,000px wide. That's the amount of space for your content (text, images, forms, etc.). The remainder (20px) is white space, created by margins and padding.
Select This Design
- Click on a design to preview it.
- Click on Select This Design to go to Site Designer's Style Editor to customize the design.
Once you've selected your design, click on it again to preview it. Click on Select This Design in the top right.
Clicking on this button will take you to the Style Editor, where you'll see the Switch to Gallery button in the top left...
Any future customizations will always update all existing pages of your site, and will appear on all new pages that you build.
If you're switching from a customized design to a new design, and you added custom CSS to the current design, that custom styling will be lost when you save the new design.
SBI! gives you a warning message before the switch, so that you're aware of what will happen. The message has the option to return to the original design, or to select the new design and move to Site Designer to customize it.
If the custom CSS is something you want to add to the new design, return to the original design, copy all the styling code in Add Custom CSS, and paste it into a text document. Then go back to the gallery and choose your new design.