- The background images used on this page are not royalty-free. Please use images from your own collection.
- The page SAMPLE is a "hidden" page that contains sets of elements grouped into "sections": Title + photo, Icons + text, text + icons + video, etc...
Select the section that best fits the design desired and copy/paste it onto your page (to “paste” in a specific location, right-click and choose Paste). Be sure to take the entirety of the section by selecting its external container (the one containing the background image or color).
- Important: each "section" must have one, and only one, inner container (element group) for the section content. The outer margins of this sub-container set minimum distances from section boundaries.
- The "Horizontal" button in the "Selection" menu controls the automatic centering of an element.
- To change the order of elements - i.e. place an element below another in a "relative" positioned container (like most of the content in the sections), use the Element Explorer on the left: green "arrow buttons" will appear when it is possible to change the order. Icons under an element and above the element group allow to put elements onto the same "line" and modify alignment.
- The entire header menu can be modified in its dedicated Layer (e.g. "Base_MenuRetractable"; simply change the page’s Layer to use a different menu). Use this to modify menu links (by copy/pasting existing links), change the colors etc. Note that these elements are pre-programmed to work with one another, so try to avoid “dragging” new ones on that could disrupt the general responsive behavior of the menu (favor using copy & paste).
- For more information, please consult the Wiki:
http://wiki.openelement.com/en/index.php?title=Responsive_Templates_%22Centered%22
Please delete this notice before publishing the final version of your website.
To change the menu’s links: edit, copy-paste, or delete the Link Elements within.
To hide an element without deleting it, use its property Visible.
NOTE TO WEBMASTER (delete after reading): the form fields (at the right) show information from the database corresponding to the currently logged user. Use only the necessary fields – all other elements can be deleted.
Use the Property “Visible” to hide the fields.
For each field element, its Property " Attribute Name" represents the name in PHP $_POST array. You can modify this Property. For example, the following PHP code gets the Email value and protects it from basic attacks (writing non-cleaned values to the database leads to very bad consequences, even if website is non-commercial and unknown):
$mail = htmlspecialchars($_POST['user_email'], ENT_QUOTES, 'UTF-8');
// if writing to MySQLi DB (prepared statements are preferred):
// $mailMySQL = $mysqli->real_escape_string($mail);
// writing to SQLite DB (prepared statements are preferred):
// $mailSQLite = $sqliteConn->escapeString($mail);
“Lock” the container (group of elements) to select inner elements easier.