Search

Exploring Quix: How Advanced Style Settings Can Save Your Time and Coding

Welcome to the seventh part of our 2-weeks series post on Exploring Quix. Today, I am going to describe the Advanced Style Settings of Quix page builder and also show how you can save your time and coding with this incredible powerful drag and drops page builder for Joomla!

Having a website is not very challenging because the cost being moderate in these days. Even you don’t need to be an IT geek to build a website.

The content management systems (CMS's) and drag and drops page builders empower the ability of both experienced and non-experienced users to create a website with the minimum amount of time and effort.

Drag and drops page builders became immensely popular day by day over the last couple of years because of its user-friendly interface.

You can create a fully functional and professional, stylish and nice-looking, and complex pages, articles, and websites relatively easily and certainly much quicker if you are using a page builder compared to working with raw source code.

With lots of features, Quix became the most powerful drag and drops page builder for Joomla. We build Quix as a complete solution for your upcoming Joomla site that is compatible with all frameworks and any templates.

Style Settings of Quix:

We placed an Advanced Styles Settings option with every element to let you the opportunity to style the elements without writing a single line of code.

Through this post, I am going to create a team section using Quix person element and will show how you can stylize your team section on the fly with the stunning and robust styles settings of Quix page builder and able to save your time.

Before we get started, let’s take a look at some examples of Quix Person Element which has been designed for our Joomla templates and used there.

Marvel is our exclusive one-page Joomla template, has released a couple of days ago. It is built with the T3 framework, Quix page builder, and cutting-edge technologies.

You will get this massively dynamic and youthful team section with this responsive Joomla template - Marvel.

Background Image: Instead of using a colorful background you can also use an image.

Margin: When you need some space in outside of the border, define it here in pixels. And don't forget to insert px after the digit. For example, 10px.

Padding: Padding defines the space between the content and the border. When you need some space on the inside of the border, define it here in pixels. And must insert px after the digit. For example, 10px.

Advanced Settings of Quix:

You may want to bring some more functionalities in styling.

If yes, what should you do?

Quix has another setting tab Advanced Settings which will help you to go this way. Quix placed advanced settings with every settings panel including section, row, column and elements.

Click on any setting options and you will see an Advanced Settings tab on the opening window.

You can notice that there has a field for class.

Now I am going to show the use of this field, means I'll show you how to bring your own style using Quix advanced settings.

Look at the image below.

I have made a team section looks like image-1. And suppose now I want to fetch a shadow on the behind of team members which looks like the image-2.

Here are the simple steps you need to follow to fetch this design.

Step 1: Just go to the following directory: YOUR_ROOT_DIRECTORY/templates/YOUR_TEMPLATE/css/template.css

Step 2: Open the template.css file using any editor.

Step 3: Add the following code at bottommost of the CSS file

.quix-new {
box-shadow: 10px 10px 5px #BFAFDF;
}

Step 4: After that, just add the class quix-new on the CSS field of advanced settings panel.

That's mainly the use of Quix advanced style settings. Hope you have learned the use of it.

Have you missed the previous parts of Exploring Quix series? Read out these:

Explore The Most Powerful Responsive First Page Builder For Joomla!

Our Track Record of Success Means Constant Updates

If you’ve been around the block very long, you know that there’s one big risk when buying a theme from a small, new company: they could go out of business and stop providing updates, which means your theme would quickly go out-of-date.

That’s why it’s important for you to know that ThemeXpert has been an industry leader since 2010--and we aren’t going away anytime soon.

In that time, we’ve helped over 102,513 users build a better website.

We’ve grown by leaps and bounds in the past few years, and we maintain a fiercely loyal following of customers for one reason: we work our hardest to make sure your themes are always 100% fast, functional, and beautiful.

100% Money Back Guarantee

If, for any reason, you don't like our membership, you can get a full refund anytime within 7 days after your first purchase. If you have any issues, just get in touch with our friendly support team and they'll either help you out until you get the results you need or give you a swift refund.

Company

Get Help

ThemeXpert is not affiliated with or endorsed by Open Source Matters or the Joomla! Project. The Joomla! logo is used under a limited license granted by Open Source Matters the trademark holder in the United States and other countries.