Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Customize upsell #31

Open
wants to merge 4 commits into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 3 additions & 3 deletions functions.php
Original file line number Diff line number Diff line change
Expand Up @@ -144,10 +144,10 @@ function himalayas_setup() {
}

/**
* Assign the Himalayas version to a variable.
* Theme Version.
*/
$theme = wp_get_theme( 'himalayas' );
$himalayas_version = $theme['Version'];
$himalayas_theme = wp_get_theme( 'himalayas' );
define( 'HIMALAYAS_THEME_VERSION', $himalayas_theme->get( 'Version' ) );

/**
* Calling in the admin area for the Welcome Page as well as for the new theme notice too.
Expand Down
101 changes: 101 additions & 0 deletions inc/customize-controls/assets/css/customizer-upsell.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,101 @@
li#accordion-section-himalayas_upsell_section h3.accordion-section-title {
background-color: #32C4D1 !important;
border-left-color: #25a4b1;
color: #fff !important;
}

#accordion-section-himalayas_upsell_section h3 a:after {
color: #fff;
}

li#accordion-section-himalayas_upsell_section h3.accordion-section-title a {
color: #fff;
}

li#accordion-section-himalayas_upsell_section h3.accordion-section-title:after {
color: #fff !important;
}

li.customize-control-himalayas-upsell-control .himalayas-upsell-wrapper {
background-color: #fff;
margin-left: -12px;
margin-right: -12px;
color: #464646;
}

li.customize-control-himalayas-upsell-control .upsell-features,
li.customize-control-himalayas-upsell-control .launch-offer {
padding: 25px;
}


li.customize-control-himalayas-upsell-control .upsell-heading {
font-size: 16px !important;
text-transform: uppercase;
margin: 0 0 15px 0;
line-height: 1.5;
color: #464646;
font-weight: bold;
}

li.customize-control-himalayas-upsell-control .upsell-features {
font-size: 14px;
}

li.customize-control-himalayas-upsell-control .upsell-feature .dashicons {
color: #32c4d1;
margin-right: 8px;
width: 14px;
}

li.customize-control-himalayas-upsell-control .upsell-feature {
padding: 0 0 8px 0;
margin: 0 0 8px 0;
}

li.customize-control-himalayas-upsell-control .upsell-feature:last-child {
margin: 0;
padding: 0;
}

li.customize-control-himalayas-upsell-control .launch-offer {
color: #0C5460;
background-color: #D1ECF1;
padding: 15px 25px;
font-size: 14px;
line-height: 1.8;
}

li.customize-control-himalayas-upsell-control .launch-offer strong {
text-transform: uppercase;
font-size: 14px;
}

li.customize-control-himalayas-upsell-control .coupon-code {
display: inline-block;
}

li.customize-control-himalayas-upsell-control .upsell-cta {
background-color: #32c4d1;
color: #fff;
padding: 14px;
margin: 30px 0;
border-radius: 4px;
text-decoration: none;
display: block;
font-size: 16px;
transition: 0.3s all;
text-transform: uppercase;
text-align: center;
}

li.customize-control-himalayas-upsell-control .upsell-cta:hover {
background-color: #46c9be;
box-shadow: 0 2px 10px 5px #46464633;
}

li#accordion-section-himalayas_upsell_section h3.accordion-section-title:hover {
background-color: rgba(50, 196, 209, 0.78) !important;
border-left-color: rgba(37, 164, 177, 0.78) !important;
}

74 changes: 46 additions & 28 deletions inc/customize-controls/class-himalayas-upsell-section.php
Original file line number Diff line number Diff line change
@@ -1,38 +1,56 @@
<?php
/**
* Class to include upsell link campaign for theme.
*
* Class HIMALAYAS_Upsell_Section
*
* @since 1.1.9
*/

class HIMALAYAS_Upsell_Section extends WP_Customize_Section {
public $type = 'himalayas-upsell-section';
public $url = '';
public $id = '';
class Himalayas_Upsell_Custom_Control extends WP_Customize_Control {

/**
* Gather the parameters passed to client JavaScript via JSON.
*
* @return array The array to be exported to the client as JSON.
*/
public function json() {
$json = parent::json();
$json['url'] = esc_url( $this->url );
$json['id'] = $this->id;
public $type = "himalayas-upsell-control";

return $json;
public function enqueue() {
wp_enqueue_style( 'himalayas-customizer', get_template_directory_uri() . '/inc/customize-controls/assets/css/customizer-upsell.css', array(), HIMALAYAS_THEME_VERSION );
}

/**
* An Underscore (JS) template for rendering this section.
*/
protected function render_template() {
public function render_content() {
?>
<li id="accordion-section-{{ data.id }}" class="himalayas-upsell-accordion-section control-section-{{ data.type }} cannot-expand accordion-section">
<h3 class="accordion-section-title"><a href="{{{ data.url }}}" target="_blank">{{ data.title }}</a></h3>
</li>
<div class="himalayas-upsell-wrapper">
<ul class="upsell-features">
<h3 class="upsell-heading"><?php esc_html_e( 'More Awesome Features', 'himalayas' ); ?></h3>
<li class="upsell-feature"><span
class="dashicons dashicons-yes"></span><?php esc_html_e( 'Advanced Header Options', 'himalayas' ); ?>
</li>
<li class="upsell-feature"><span
class="dashicons dashicons-yes"></span><?php esc_html_e( 'Advanced Footer Options', 'himalayas' ); ?>
</li>
<li class="upsell-feature"><span
class="dashicons dashicons-yes"></span><?php esc_html_e( 'More Blog Layouts', 'himalayas' ); ?>
</li>
<li class="upsell-feature"><span
class="dashicons dashicons-yes"></span><?php esc_html_e( 'More WooCommerce ', 'himalayas' ); ?>
</li>
<li class="upsell-feature"><span
class="dashicons dashicons-yes"></span><?php esc_html_e( 'More Customizer Options', 'himalayas' ); ?>
</li>
<li class="upsell-feature"><span
class="dashicons dashicons-yes"></span><?php esc_html_e( 'Advanced Typography Options', 'himalayas' ); ?>
</li>
<li class="upsell-feature"><span
class="dashicons dashicons-yes"></span><?php esc_html_e( 'More Page Settings', 'himalayas' ); ?>
</li>
</ul>

<div class="launch-offer">
<?php
printf(
/* translators: %1$s discount coupon code., %2$s discount percentage */
esc_html__( 'Use the coupon code %1$s to get %2$s discount (limited time offer). Enjoy!', 'himalayas' ),
'<span class="coupon-code">save10</span>',
'10%'
);
?>
</div>
</div> <!-- /.himalayas-upsell-wrapper -->

<a class="upsell-cta" target="_blank"
href="<?php echo esc_url( 'https://themegrill.com/himalayas-pricing/?utm_source=himalayas-customizer&utm_medium=view-pricing-link&utm_campaign=upgrade' ); ?>"><?php esc_html_e( 'View Pricing', 'himalayas' ); ?></a>
<?php
}

}
33 changes: 19 additions & 14 deletions inc/customizer.php
Original file line number Diff line number Diff line change
Expand Up @@ -429,20 +429,25 @@ function himalayas_customize_register( $wp_customize ) {
) );
// End of the Additional Options.

// Register `HIMALAYAS_Upsell_Section` type section.
$wp_customize->register_section_type( 'HIMALAYAS_Upsell_Section' );

// Add `HIMALAYAS_Upsell_Section` to display pro link.
$wp_customize->add_section(
new HIMALAYAS_Upsell_Section( $wp_customize, 'himalayas_upsell_section',
array(
'title' => esc_html__( 'View PRO version', 'himalayas' ),
'url' => 'https://themegrill.com/themes/himalayas/?utm_source=himalayas-customizer&utm_medium=view-pro-link&utm_campaign=view-pro#free-vs-pro',
'capability' => 'edit_theme_options',
'priority' => 1,
)
)
);
/**
* Upsell.
*/
$wp_customize->add_section( 'himalayas_upsell_section', array(
'priority' => 1,
'title' => __( 'View Pro Version', 'himalayas' ),
) );

$wp_customize->add_setting( 'himalayas_upsell', array(
'default' => '',
'capability' => 'edit_theme_options',
'sanitize_callback' => 'himalayas_false_sanitize',
) );

$wp_customize->add_control( new Himalayas_Upsell_Custom_Control( $wp_customize, 'himalayas_upsell', array(
'section' => 'himalayas_upsell_section',
'setting' => 'himalayas_upsell',
) ) );

/**************************************************************************************/

function himalayas_sanitize_checkbox( $input ) {
Expand Down