Yt-FrameWork
EXAMPLE:
ATTRIBUTES OF "LAYOUT" TAG
- Type attribute: This attribute specifies types of layout which layout_name.xml file forms. There are 6 basic layout types. The fundamental difference of them is how to arange components of block or "content" tag (the special tag). Following parts will bring to you nearer eyes with 6 layout types.
- Left-main-right:
- "Position" tags in "Content" tag:
- Left-right-main:
- "Position" tags in "Content" tag:
- Main-left-right:
- "Position" tags in "Content" tag:
- Left-main
- Main-right
- Full
- Customization layout: From 6 basic layout types, you can customize to suit your demand. Following example is used for customization layout is Left-Main-Right:
Width of Group left = 220*n
Width of Group right = 220*m
Position" tags in "Content" tag:
- Width attribute: This attribute specifies width of main part (div.yt-main) in block
- Customization Layout width: If you want to do the main part (div.yt-main) in any blocks (e.g.: id of example block is yt-example) bigger than other blocks, you could do like as:
- Style: #yt-example .yt-main{width:1100px }
- Add Autosize=”0”
- Style positions in that block
Mega Menu Instructions
Adding a module position to a Yt Framework Template
When you want to add a postion with demoposition name, please open templates//layouts/Example:
- positions tag: group of positions. You have to put new position into this tag
- position tag: you will use this tag to define new position.
- width attribute: the width of module
- style attribute: this attribute is as style in the default of joomla template
- type attribute: there are two types modules and module
Document
Recently Updated
Yt Framework uses xml file to render your layout. The framework supports all general features of a joomla template. The below is the list of features:
- Multiple Layouts: Left-Main-Right, Left-Main, Main-Right, etc. With xml file, you can easy to create some layouts for a joomla template
- Mobile Ready
- Table-less Layout
- Search Engine Friendly
- Modules Types
- Cross-browser Support
- Typography
- Validation
- Template Parameters
- Google Font
- Font Size
- RTL language support
Yt-FrameWork is a fast and powerful template framework for Joomla. It lets you create sophisticated templates in no time, even for comprehensive websites.
This framework is using xml files to create layouts for Joomla template. The framework allows you easy to create positions via xml file. Also, in each layout, you will easy to move and duplicate a block.
View our demo to have a closer look about our framework
Layout type:
This is the Type attribute of tag. It rules layout type which layout_name.xml file specifies
Template Width:
This is param of template. It rules width of blocks' main (div.yt-main).
2. METHOD OF FRAMEWORK:
A website will be separated into blocks from the top to footer. Width of the main block (div.yt-main) is "". Width of positions in block will be calculated to base on that "".
Yt Framework use .xml file (layout_name.xml) to arrange blocks, positions ... by xml tags which Framework rules like as: "block", "position"...
Yt Framework use .xml file (layout_name.xml) to arrange blocks, positions ... by xml tags which Framework rules like as: "block", "position"...
3. HOW TO USE LAYOUT FILE (layout_name.xml)
Please read in ascending order4. HOW TO OVERRIDE LAYOUT, OVERRIDE CSS MODULES
5. HOW TO USE FEATURES
September.10.2011
Customize Content block with some special cases
- Written by Template Supporter
- Posted in Yt-FrameWork
Example1:
Case1:Case2:
Case3:
Case4:
September.10.2011
Customize a block with position tag
- Written by Template Supporter
- Posted in Yt-FrameWork
Example 1:
Do you want the width of position in the block is equal?You will declare tags like as fllowing:
The result is positions: user3, user4, user5, user6 will has width = Layout width / 4. HTML of block spotlight1 is:
Example 2:
Do you want to create some positions in block has specific width and rest of positons are equal width?You will declare tags like as fllowing:
The result of user3 has width is 400px and user4, user5, user6 has width is (Layout width – 400) / 3. HTML code of spotlight1 like as following:
Example 3: The block example declares "offset":
The user3, user4, user5, user6 has width=(Layout width - 50 )/4. HTML code of spotlight1 like as following:
Example 4: The block example declares "group":
HTML code of footer2 like as following: