BuilderChild-Lucky7 - Revision history

Sridhar at 06:17, November 6, 2012

2012-11-06T06:17:12Z

Sridhar: Added = How to add a pink custom module style for widget bar modules =

2011-06-23T05:06:56Z

Added = How to add a pink custom module style for widget bar modules =

Sridhar: /* Layouts and settings of demo site export file */

2011-05-07T09:38:39Z

Layouts and settings of demo site export file

Sridhar: Added "Layouts and settings of demo site export file"

2011-05-07T09:37:35Z

Added "Layouts and settings of demo site export file"

Sridhar at 18:57, April 30, 2011

2011-04-30T18:57:06Z

Sridhar: Added "How to change the colors of modules" and "How to edit/add custom module styles in Lucky 7"

2011-04-30T18:47:06Z

Added "How to change the colors of modules" and "How to edit/add custom module styles in Lucky 7"

New page

=How to change the colors of modules=

Edit your site layout(s), edit the module(s) you would like to change the color of and choose your desired color from Style dropdown.

Screenshots below show this being applied for image module:

<gallery widths=200px caption="">
File:Lucky7-imagemodule-default.png
File:Lucky7-imagemodule-blue-style.png
File:Lucky7-imagemodule-blue.png
</gallery>

=How to edit/add custom module styles in Lucky 7=

Edit theme's lib/classes.php file.

For a detailed example, refer to [http://ithemes.com/codex/page/Builder_Features#Custom_Module_Styles this] entry.

← Older revision		Revision as of 06:17, November 6, 2012
Line 1:		Line 1:
−	[http://demos.~~ithemesbuilder~~.com/lucky7/ Live Demo]	+	[http://demos.ithemes.com/lucky7/ Live Demo]

	= Layouts and settings of demo site export file =		= Layouts and settings of demo site export file =

← Older revision		Revision as of 05:06, June 23, 2011
Line 24:		Line 24:

	For a detailed example, refer to [http://ithemes.com/codex/page/Builder_Features#Custom_Module_Styles this] entry.		For a detailed example, refer to [http://ithemes.com/codex/page/Builder_Features#Custom_Module_Styles this] entry.
		+
		+	= How to add a pink custom module style for widget bar modules =
		+
		+	<gallery widths=200px caption="Before and After">
		+	File:Pink-module-style-before.png
		+	File:Pink-module-style-after.png
		+	</gallery>
		+
		+	'''1.''' Edit child theme's lib/classes.php.
		+
		+	Add
		+
		+	<pre class="brush:php;">
		+
		+	builder_register_module_style( 'widget-bar', 'Pink', 'widget-bar-pink' );
		+	</pre>
		+
		+	below
		+
		+	<pre class="brush:php;">
		+	builder_register_module_style( 'widget-bar', 'Purple', 'widget-bar-purple' );
		+	</pre>
		+
		+	'''2.''' Edit child theme's style.css.
		+
		+	Add
		+
		+	<pre class="brush:css;">
		+	/* pink */
		+	.widget-bar-pink-outer-wrapper {
		+	background: #FFB1B8;
		+	}
		+	.widget-bar-pink {
		+	text-shadow: #000000 0 1px 1px;
		+	color: #FFFFFF;
		+	}
		+	.widget-bar-pink .builder-module-block {
		+	background-color: #FFFFFF;
		+	color: #444444;
		+	text-shadow: none;
		+	border-color: #BBBBBB #DDDDDD #DDDDDD #BBBBBB;
		+	}
		+	.widget-bar-pink h4.widget-title {
		+	color: #431213;
		+	border-color: #C76A67;
		+	text-shadow: #FFDEDA 0px 1px 1px;
		+
		+	}
		+	.widget-bar-pink-outer-wrapper a {
		+	color: #D9E0FF;
		+	}
		+	.widget-bar-pink-outer-wrapper a:hover {
		+	color: #FFFFFF;
		+	text-shadow: none;
		+	}
		+	</pre>
		+
		+	above
		+
		+	<pre class="brush:css;">
		+	/*********************************************
		+	Footer Module
		+	*********************************************/
		+	</pre>
		+
		+	'''3.''' Edit the layout(s), edit widget bar module(s) for which you would like to apply pink background and select Pink from the Style dropdown.

← Older revision		Revision as of 09:38, May 7, 2011
Line 4:		Line 4:

	To download a zip file containing Layouts and Settings of Lucky 7 demo site, click [http://d.pr/ohSq here].		To download a zip file containing Layouts and Settings of Lucky 7 demo site, click [http://d.pr/ohSq here].
		+
		+	To import these, go to My Theme -> Settings -> Import / Export and proceed.

	=How to change the colors of modules=		=How to change the colors of modules=

← Older revision		Revision as of 09:37, May 7, 2011
Line 1:		Line 1:
	[http://demos.ithemesbuilder.com/lucky7/ Live Demo]		[http://demos.ithemesbuilder.com/lucky7/ Live Demo]
		+
		+	= Layouts and settings of demo site export file =
		+
		+	To download a zip file containing Layouts and Settings of Lucky 7 demo site, click [http://d.pr/ohSq here].

	=How to change the colors of modules=		=How to change the colors of modules=

← Older revision		Revision as of 18:57, April 30, 2011
Line 1:		Line 1:
		+	[http://demos.ithemesbuilder.com/lucky7/ Live Demo]
		+
	=How to change the colors of modules=		=How to change the colors of modules=