Super User
Donec ornare tincidunt pulvinar. In sit amet magna a libero ultricies sagittis consectetur at felis. Aliquam at sapien vel sem iaculis dignissim ut sed nibh. Duis egestas sollicitudin commodo. Pellentesque blandit ligula in lorem pretium bibendum. Quisque eros mi, pellentesque ut luctus sed, aliquet non libero. Curabitur nec iaculis est.
Nunc a odio a libero imperdiet euismod vitae non leo
Nulla a tortor in leo elementum volutpat. Mauris in diam nec quam dictum sagittis quis ut enim. Fusce tempus massa vel ipsum fringilla facilisis. Duis quis nisi arcu. Maecenas id posuere mi. Curabitur sagittis ante nec dolor lobortis porttitor. Praesent lacus enim, pharetra a convallis vitae, tristique id magna. Morbi at massa enim, sollicitudin laoreet felis. Vestibulum ut est vitae nunc varius sagittis vitae a felis. Sed viverra turpis eleifend purus fermentum cursus. Duis sed egestas turpis.
Fruit Shop
Welcome to the Fruit Shop
We sell fruits from around the world. Please use our website to learn more about our business. We hope you will come to our shop and buy some fruit.
This mini site will show you how you might want to set up a site for a business, in this example one selling fruit. It shows how to use access controls to manage your site content. If you were building a real site, you might want to extend it with e-commerce, a catalog, mailing lists or other enhancements, many of which are available through the Joomla! Extensions Directory.
To understand this site you will probably want to make one user with group set to customer and one with group set to grower. By logging in with different privileges you can see how access control works.
Fusce vitae lorem lacus, ut dapibus nunc! Maecenas tellus dolor, volutpat nec posuere eu, semper sed orci? Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam scelerisque tincidunt malesuada. Fusce quis mi augue. Suspendisse magna urna, hendrerit at eleifend vel, pulvinar ut ligula. Pellentesque id purus libero. Vivamus vehicula tortor lacus, non gravida lacus.
Nulla vitae turpis est. Sed rutrum diam sit amet turpis sagittis elementum. Curabitur mi sem, eleifend nec tempus nec, cursus quis urna. Nunc eu ipsum ante, et rhoncus dolor. Phasellus molestie ultrices mi id pulvinar! Donec eros ante, ultricies nec ultrices in, consequat in sem. Nunc est massa, eleifend ut aliquam sed, egestas ut nisl.
Vestibulum quis gravida est! Nam semper sodales sapien id fringilla. Fusce massa erat; sodales eu rhoncus quis, elementum ac purus? Nulla dictum pharetra velit, eu fringilla lacus hendrerit ut. Vivamus urna massa, eleifend non tristique non, malesuada vel diam.
Praesent dapibus, neque vel condimentum gravida, velit diam tempus purus, et fringilla metus nibh sit amet elit. Nunc eget nisi erat, sit amet vehicula massa? Nulla blandit volutpat quam eget consectetur. Aliquam fringilla imperdiet facilisis.
Praesent lobortis, metus ut ultrices imperdiet, mauris velit rutrum libero, vitae congue leo urna eget turpis? Duis tellus lectus, ultrices vel gravida porttitor; facilisis mollis risus. Pellentesque ut ipsum purus, vel consequat ante. Etiam placerat scelerisque ipsum id laoreet. Donec facilisis sem vel magna lobortis vel semper elit facilisis! Curabitur eget turpis id urna tincidunt gravida.
Suspendisse lacinia vehicula erat, sed aliquet augue ultrices in. Donec lobortis, nibh sed sagittis venenatis, augue dolor dignissim orci, nec suscipit nisi lorem quis lectus. Integer sit amet massa eu diam eleifend consectetur eget et tellus. Phasellus non sapien vitae magna bibendum lobortis non at lectus.
Happy Orange Orchard
At our orchard we grow the world's best oranges as well as other citrus fruit such as lemons and grapefruit. Our family has been tending this orchard for generations.
Morbi et nibh ut dolor consequat elementum. Morbi ac magna vitae odio aliquet pellentesque nec vel tortor! Phasellus quis congue lorem. Aliquam tincidunt lacus eu mi fringilla tristique. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Sed ultrices mattis dapibus.
Sed tincidunt ipsum vitae elit aliquam hendrerit. Morbi elementum ultricies nisi nec tincidunt. Ut sit amet urna ligula, in mattis leo? Pellentesque ut enim sit amet magna sodales tincidunt quis et ligula.
Vivamus vehicula, ante et auctor ultricies, neque enim euismod leo; eu molestie ante diam et ligula. Nulla vitae mi leo. Praesent at diam libero, nec aliquam mauris. Praesent sed odio sapien. Vestibulum scelerisque ante sed odio pretium id adipiscing metus hendrerit. Integer vulputate neque vel nibh ornare eget vestibulum odio molestie. Suspendisse potenti.
Donec nisi lectus, condimentum et aliquet id, aliquet id odio. Sed ut urna ac diam porta volutpat sed vitae massa. Ut adipiscing tincidunt gravida. Praesent pretium; metus vel tincidunt venenatis, nisi metus pulvinar tellus, nec venenatis turpis diam ac arcu! Integer consectetur semper urna, nec blandit lectus interdum et.
Proin ultrices, ipsum at rhoncus vulputate, dolor ligula accumsan justo, eget congue odio lacus vel elit. Aenean id lacus risus, sit amet imperdiet urna. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Integer placerat velit non dolor lobortis nec viverra magna consectetur. Fusce nec sapien justo. In ac ante massa. Fusce quis massa sit amet enim lobortis congue at sit amet dui?
Getting Started
It's easy to get started creating your website. Kn owing some of the basics will help.
What is a Content Management System?
A content management system is software that allows you to create and manage webpages easily by separating the creation of your content from the mechanics required to present it on the web.
In this site, the content is stored in a database. The look and feel are created by a template. The Joomla! software brings together the template and the content to create web pages.
Site and Administrator
Your site actually has two separate sites. The site (also called the front end) is what visitors to your site will see. The administrator (also called the back end) is only used by people managing your site. You can access the administrator by clicking the "Site Administrator" link on the "This Site" menu or by adding /administrator to the end of you domain name.
Log in to the administrator using the username and password created during the installation of Joomla.
Logging in
To login to the front end of your site use the login form or the login menu link on the "This Site" menu. Use the user name and password that were created as part of the installation process. Once logged-in you will be able to create and edit articles.
In managing your site, you will be able to create content that only logged-in users are able to see.
Creating an article
Once you are logged-in, a new menu will be visible. To create a new article, click on the "submit article" link on that menu.
The new article interface gives you a lot of options, but all you need to do is add a title and put something in the content area. To make it easy to find, set the state to published and put it in the Joomla category.
Learn more
There is much more to learn about how to use Joomla! to create the web site you envision. You can learn much more at the Joomla! documentation site and on the Joomla! forums.
Google Map
Get the code
{googleMaps addr="ADDRESS OR Latitude/Longitude" label="GOOLE_MAP_LABEL" width=400 height=400}
Customization Options
Divider
Fusce ac justo quis nisl auctor consectetur. Aliquam lobortis nisi nec ligula congue ultrices. Nam eleifend suscipit eros, a ultrices nulla vehicula id. Vestibulum euismod mollis tellus, at bibendum elit ultricies in. Donec sodales congue augue id porta. Curabitur vehicula ligula nec turpis tristique eget gravida quam aliquam. Fusce neque risus, faucibus quis blandit posuere, faucibus id neque. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Maecenas euismod lectus at lectus egestas pharetra.
Etiam malesuada ante quis risus accumsan ut congue nibh gravida. Curabitur et arcu nibh, sit amet pellentesque enim. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque eget tristique tortor. Vivamus nibh tortor, tempus et faucibus vel, tincidunt eu turpis. In eu diam vulputate nisi tristique accumsan. Vestibulum ullamcorper vulputate leo gravida feugiat. Ut vitae dui odio, vitae tristique orci.
Get The Code
[divider scroll_text='Go to top']
Gallery
Cras nec neque
Get the code
[gallery title='GALLERY_TITLE' width='IMAGE_THUMB_WIDTH' height='IMAGE_THUMB_HEIGHT' columns='3']
[gallery_item title='IMAGE_TITLE' src='IMAGE_SRC']IMAGE_DESCRIPTION[/gallery_item]
[gallery_item title='IMAGE_TITLE' src='IMAGE_SRC']IMAGE_DESCRIPTION[/gallery_item]
[gallery_item title='IMAGE_TITLE' src='IMAGE_SRC']IMAGE_DESCRIPTION[/gallery_item]
[/gallery]
Accordion
Donec neque metus
Sed ac rhoncus purus. Mauris mattis vestibulum posuere. Phasellus ut justo nec est adipiscing tristique. Integer tristique, arcu a tempor vulputate, nulla est viverra tellus, vel euismod lacus nibh non neque. Nulla et metus nibh, ut feugiat nunc. Donec ultrices placerat enim, nec rhoncus eros consequat quis.Nullam mattis ipsum
Sed ac rhoncus purus. Mauris mattis vestibulum posuere. Phasellus ut justo nec est adipiscing tristique. Integer tristique, arcu a tempor vulputate, nulla est viverra tellus, vel euismod lacus nibh non neque. Nulla et metus nibh, ut feugiat nunc. Donec ultrices placerat enim, nec rhoncus eros consequat quis.Nam vehicula
Sed ac rhoncus purus. Mauris mattis vestibulum posuere. Phasellus ut justo nec est adipiscing tristique. Integer tristique, arcu a tempor vulputate, nulla est viverra tellus, vel euismod lacus nibh non neque. Nulla et metus nibh, ut feugiat nunc. Donec ultrices placerat enim, nec rhoncus eros consequat quis.
Get The Code
[accordion]
[acc_item title='ITEM_TITLE']ADD_CONTENT_HERE[/acc_item]
[acc_item title='ITEM_TITLE']ADD_CONTENT_HERE[/acc_item]
[acc_item title='ITEM_TITLE']ADD_CONTENT_HERE[/acc_item]
[/accordion]
Blockquote
Ut magna diam, condimentum nec vulputate eget, blandit condimentum ligula. Nunc sagittis molestie nulla, et fringilla est adipiscing at. Proin aliquet sapien ut justo viverra at interdum risus posuere. Integer hendrerit nisi dignissim nibh mattis accumsan. Integer sit amet augue vitae diam lobortis commodo vel et odio. Aliquam hendrerit, quam vitae aliquam blandit, diam ipsum tincidunt arcu, ac varius turpis nisi eu libero. Nunc ac ante mauris. Morbi at libero non tellus rhoncus scelerisque at vitae est. Praesent sed felis risus. Proin tristique, mi id semper pulvinar, leo orci iaculis urna, sed ultricies turpis sem a purus. Integer mattis elit sit amet erat varius sit amet accumsan orci eleifend. Duis tristique est et felis ultricies sit amet interdum lacus adipiscing. Sed quam mi, sagittis sed tincidunt at, mattis sed orci. Sed egestas turpis a nibh suscipit cursus. Vivamus sagittis sapien eu justo rutrum in auctor nibh blandit
Ut magna diam, condimentum nec vulputate eget, blandit condimentum ligula. Nunc sagittis molestie nulla, et fringilla est adipiscing at. Proin aliquet sapien ut justo viverra at interdum risus posuere. Integer hendrerit nisi dignissim nibh mattis accumsan. Integer sit amet augue vitae diam lobortis commodo vel et odio. Aliquam hendrerit, quam vitae aliquam blandit, diam ipsum tincidunt arcu, ac varius turpis nisi eu libero. Nunc ac ante mauris. Morbi at libero non tellus rhoncus scelerisque at vitae est. Praesent sed felis risus. Proin tristique, mi id semper pulvinar, leo orci iaculis urna, sed ultricies turpis sem a purus. Integer mattis elit sit amet erat varius sit amet accumsan orci eleifend. Duis tristique est et felis ultricies sit amet interdum lacus adipiscing. Sed quam mi, sagittis sed tincidunt at, mattis sed orci. Sed egestas turpis a nibh suscipit cursus. Vivamus sagittis sapien eu justo rutrum in auctor nibh blandit
Ut magna diam, condimentum nec vulputate eget, blandit condimentum ligula. Nunc sagittis molestie nulla, et fringilla est adipiscing at. Proin aliquet sapien ut justo viverra at interdum risus posuere. Integer hendrerit nisi dignissim nibh mattis accumsan. Integer sit amet augue vitae diam lobortis commodo vel et odio. Aliquam hendrerit, quam vitae aliquam blandit, diam ipsum tincidunt arcu, ac varius turpis nisi eu libero. Nunc ac ante mauris. Morbi at libero non tellus rhoncus scelerisque at vitae est. Praesent sed felis risus. Proin tristique, mi id semper pulvinar, leo orci iaculis urna, sed ultricies turpis sem a purus. Integer mattis elit sit amet erat varius sit amet accumsan orci eleifend. Duis tristique est et felis ultricies sit amet interdum lacus adipiscing. Sed quam mi, sagittis sed tincidunt at, mattis sed orci. Sed egestas turpis a nibh suscipit cursus. Vivamus sagittis sapien eu justo rutrum in auctor nibh blandit
Get The Code
[quote align='center' color='#999999']ADD_CONTENT_HERE[/quote]
[quote align='left' color='#999999']ADD_CONTENT_HERE[/quote]
[quote align='right' color='#999999']ADD_CONTENT_HERE[/quote]
Buttons
| Button | class="" | Description |
|---|---|---|
btn |
Standard gray button with gradient | |
btn btn-primary |
Provides extra visual weight and identifies the primary action in a set of buttons | |
btn btn-info |
Used as an alternative to the default styles | |
btn btn-success |
Indicates a successful or positive action | |
btn btn-warning |
Indicates caution should be taken with this action | |
btn btn-danger |
Indicates a dangerous or potentially negative action | |
btn btn-inverse |
Alternate dark gray button, not tied to a semantic action or use |
Get the code
<button class="btn">Default</button><button class="btn btn-primary">Primary</button>
<button class="btn btn-info">Info</button>
<button class="btn btn-success">Success</button>
<button class="btn btn-warning">Warning</button>
<button class="btn btn-danger">Danger</button>
<button class="btn btn-inverse">Inverse</button>
Buttons for actions
As a convention, buttons should only be used for actions while hyperlinks are to be used for objects. For instance, "Download" should be a button while "recent activity" should be a link.
Button styles can be applied to anything with the .btn class applied. However, typically you'll want to apply these to only <a> and <button> elements.
Cross browser compatibility
IE9 doesn't crop background gradients on rounded corners, so we remove it. Related, IE9 jankifies disabled button elements, rendering text gray with a nasty text-shadow that we cannot fix.
Multiple sizes
Fancy larger or smaller buttons? Add .btn-large, .btn-small, or .btn-mini for two additional sizes.
Disabled state
For disabled buttons, add the .disabled class to links and the disabled attribute for <button> elements.
Heads up! We use .disabled as a utility class here, similar to the common .active class, so no prefix is required.
One class, multiple tags
Use the .btn class on an <a>, <button>, or <input> element.
<a class="btn" href="/">Link</a>
<button class="btn" type="submit">
Button
</button>
<input class="btn" type="button"
value="Input">
<input class="btn" type="submit"
value="Submit">
As a best practice, try to match the element for you context to ensure matching cross-browser rendering. If you have an input, use an <input type="submit"> for your button.
Consulte Nuesto Aviso de Privacidad