Create Websites with CHEETAH
"Rapid Design" of a first website (2)
Now you should try the special properties "Origin", "Position", "Repeat" and "Size" in the properties area of the "Internal Background" and observe what happens to the image in the editor.
On top of the content banner there is a blue box with a text template that covers the upper part of the image. Next, you should delete this box using the trash function of the corresponding header menu.
Now let's quickly take a look at the header. Since we don't need either the logo or the menu, we delete both elements in the same way as we deleted the box. Instead, we want to add a nice slogan to the remaining header banner: "The luxury of a cigar is not its price, but the time you spend with it". And that, too, is quickly done. To do this, we switch to the "Text" category in the element selection and from there we drag an H6 heading onto the banner and align the circumscribed rectangle slightly to the left on the banner. Then we double-click on it to switch to the text editor, where we first select the sample text with the mouse and change the text color to "Yellow". Then replace this text with the advertising slogan (can also be done in the usual way via the clipboard from a text file). Now you only have to set the text alignment to "left-justified". You should also change the basic formatting in the corresponding drop-down box from "H6" to "Neutral Paragraph" in order not to confuse a search engine crawler unnecessarily... By the way, you should select the font and the font size in such a way that the entire text approximately fills the page content area (mark the text completely with the mouse beforehand!). Otherwise the change of the font size will have no effect). The best thing to do here is to take the opportunity to play around with this editor...
Tip: Instead of this "inline editor", you can also open a separate editor window via the header menu (symbol "T") of the corresponding text element and conveniently format your text in it. Only note that - if the font color is set to "White" - the text will only become visible when you select it in the editor with the mouse!
Using the same method, you can now replace and possibly reformat the text on the banderole. Before you do this, you should delete the action button and replace the blue background color of the banderole box with a matching brown (color code HEX "3C3427").
Note: In the unified color picker of the "Cheetah" elements you can always explicitly enter a color code either in HEX or RGB format. Such color codes can be easily taken from FLAT UI - color palettes or by means of a "color picker" directly from web pages. In this context, you should install the Chrome extension "ColorPick Eyedropper" or an analogous tool and try it once. You will not want to miss it any more.
In the end, the content banner could look like this (shorten box length to 570 pixels, display right corners rounded with radius 10):
With this, the "content banner" is ready for now and we can devote ourselves to the footer. The texts are quickly exchanged:
You have surely noticed when clicking that the texts are located on completely transparent boxes. This way they can be repositioned as a whole (or saved as a template, etc.) by simply moving the entire container box and not each individual text separately to the desired location.
The order form for the newsletter remains. According to the labeling of the header menu, this is a special "Mailingboss form", which makes sense, by the way, because with this website we want to collect, among other things, the e-mail addresses of cigar lovers, in order to be able to address them later specifically in the context of e-mail marketing campaigns. In concrete terms, this means that - as soon as someone orders a newsletter via this form - their email address will end up in a special list in Builderall's "Mailingboss" email autoresponder. You can either create such a list separately in Mailingboss, link an existing one to the input form or create a list directly from the input form. To do this, you need to click the button with the gear icon in its header menu, which will open a small dialog box.