Page Builder by AZEXO
Why HTML – not traditional nested shortcodes?
In most instances of WordPress web sites – web page sections and parts doesn’t take dynamic content material from WordPress database – and if we implement them through static HTML it permit us to make WYSIWYG stay web page modifying quick, dependable working for any complicated design (and with out large investments). For different instances builder help WordPress shortcodes – it is not going to have WYSIWYG stay modifying however it may be edited through popup dialog.
Many different WordPress front-end builders present solely shortcode modifying – which is complicated and never very intuitive.
Main goal of this venture – consumer should edit content material:
- and never examine many buttons round content material
- and never examine settings popup (panel, web page and so on)
- and never learn documentation (documentation for trivial UI parts is unacceptable too)
- and never make experiments together with your theme – change settings right here and there then see end result
It could be completely solved solely by front-end HTML editor. Browser have already got the whole lot to WYSIWYG modifying DOM (Document Object Model) – simply want so as to add few limitations into it for complicated designs – and it’ll work like Microsoft Word.
Library format is impartial to CMS/platform/builder and server language
Sections/parts format was designed for independence from platform/builder as a lot as doable – it’s trivial and saved in HTML/LESS/JS/JSON information. Our builder have HTML parsing framework for quick connection to CMS API of parts/sections which required dynamic content material. If you might be growing your personal builder for any CMS or platform you’ll be able to simply combine our very big library of blocks – see library format.
Our method enhance lifetime of HTML/CSS by multi-platforming, quick port to new platforms and by lower sources spend for code-support.
As bonus – easy and speedy CMS themes growth – you don’t want to know JavaScript (in the event you like our JavaScript framework), CMS API and server language (PHP if we speak about WordPress). Also it’s straightforward to implement export demo of theme by one click on from WordPress to any CMS – if it have already got builder with similar structure.
Developer guide – see how simple theme development can be
How shortcodes supported
- You can add any third-party shortcode through front-end or back-end builder. In front-end builder can be confirmed rendered HTML and builder will block any mouse clicks on it – on this case you’ll be able to edit attributes solely in textual content mode.
- You can combine shortcode into builder with attributes editor dialog window help – for this it’s essential register it through azh_add_element($configuration) builder operate, which take shortcode configuration in very comparable format with vc_map of Visual Composer plugin. In this case you’ll be able to edit attributes through popup dialog.
Templates auto-generation based mostly on static HTML of sections/parts
Why HTML-coder have so large freedom and supply so unstructured code in traditional approaches? Themes growth comprise repeating components and it may be optimized – we tried to standardize HTML code in our growth course of – this permit to automatize conversion to PHP templates (on this builder we select shortcodes for retailer templates). As end result this elevated our growth velocity.
All sections with menus, posts record, web page titles, breadcrumbs and so on – mechanically transformed (after web page save) to dynamic shortcode which take required data from WordPress database. This is carried out by including few CSS courses to HTML tags of component/part like: az-page-title, az-breadcrumbs and so on. At the primary saving web page second – builder parse HTML discover this CSS courses, minimize HTML items and use them as template of shortcode – which is put as an alternative of this HTML. After this builder permit to alter shortcode attributes. See the way it carried out here.
You can simply prolong shortcodes auto-generation with our HTML parsing framework – in the event you want 100% break up PHP-programming and repeating HTML/CSS-coding in your organization
Export from WordPress theme demo to HTML template
You can export from WordPress demo to HTML template prepared kind ThemeForest submit by one click on. How to do that:
- Remove pages with templates offered by theme from foremost menu – it is best to export it manually (or you need to use our theme framework to export weblog pages mechanically)
- Make each web page through blank-page-template offered by web page builder
- Make header, menu and footer through web page builder particular widgets
- Chose foremost menu as pages record which must be exported and run export
- After export all pages will saved as HTML information in a single folder with all required property. HTML code can have right URLs and with out inline types.
Coding requirements
Every component or part have one place in LESS (and HTML) code – so you’ll be able to simply discover it, customise and you’ll be completely certain that it’ll not have an effect on to different sections/parts. Every a part of LESS types could be simply eliminated to offer solely the types for sections/elments which are wanted in your venture.
Independent to CSS setting
- All CSS courses have library prefix “azen” – to forestall penetration of library types to CSS setting.
- Only 4 tags allowed in library: div, span, img, a (and few varieties associated tags).
Every tag which utilized in component/part have resetted CSS types by high-weight selector ”.azen.azen1.azen2.azen3.azen4” – to forestall penetration of types from CSS setting.
Zero CSS conflicts permit you all the time assume solely about one part/component throughout growth – not about total venture. See our LESS customary here.