Hey guys!!

If you want to hide or remove the header of all text boxes in main page but still keep the edit button and function. Use these CSS:

 

 

 

 

 

 

 

 


/* Remove Text Box Header in main page */
.xg_widget_main_index .module_text .xg_module_head h2
{
display: none;
}
.xg_widget_main_index .module_text .xg_module_head
{
padding: 0;
margin: 0;
overflow: visible;
}
.xg_widget_main_index .module_text .xg_module_head .edit
{
position: absolute;
right: 0;
top: -30px;
}

 

 

For text boxes in side bar and all pages, to remove the header, use the same CSS code and replace .xg_widget_main_index to #column2 . For example:


/* Remove Text Box Header in side bar */
#column2 .module_text .xg_module_head h2
{
display: none;
}
#column2 .module_text .xg_module_head
{
padding: 0;
margin: 0;
overflow: visible;
}
#column2 .module_text .xg_module_head .edit
{
position: absolute;
right: 0;
top: -30px;
}

 

These CSS code should put in Advanced CSS of Design Studio or Theme Editor.

 

Best Practice

When you use text box for ad banner, image slider, image link or special content... and don't need the tittle text and any white space. You can use these CSS code. :)

 

 

Views: 998

Reply to This

Replies to This Discussion

Very nice, thanks for sharing!

Thanks for the tip!

Does anyone know if I can just remove the header of 1 text box on the main page?

Thanks alot

Grego,

It depends on which Text Box. They all share the same class name. We can remove the first Text Box with first-child of either column, which will only work in versions of IE, 9+. We could also do it with custom script, but it would hesitate a little due to code being added to Custom code Box.

Best,

Jen

Hi Jen

Thanks again for the quick reply.

It would be the first text box header @ www.BeAMusicPro.com (the slider textbox header)

Best regards

Grego,

Give this a try - - Alex's code edited for first Text Box Header in Left Column:

/* Remove Text Box Header in main page - - 1st Text Box */
.xg_widget_main_index #column1 .module_text:first-child .xg_module_head h2
{
display: none;
}
.xg_widget_main_index #column1 .module_text:first-child .xg_module_head
{
padding: 0;
margin: 0;
overflow: visible;
}
.xg_widget_main_index #column1 .module_text:first-child .xg_module_head .edit
{
position: absolute;
right: 0;
top: -30px;
}

 

The code below removes edit button, as well. Use Alex's version above, or the below, not both. =)
To edit the Text Box, you would either need to know how to use FireBug to temporarily remove the CSS while editing, or remove this CSS code to edit box.:

.xg_widget_main_index #column1 .module_text:first-child .xg_module_head {
display:none;
}

Best,

Jen

Worked! Great...

Great Job, Alex!

RSS

Members

© 2024   Created by JenSocial.   Powered by

Badges  |  Report an Issue  |  Terms of Service

Home
VIP Ning Tips