flatsome-child\change\shortcodes\donate.php
php
Donate
<?php
function donate_sc($atts, $content = null)
{
extract($atts = shortcode_atts(array(
'donate_value' => '',
'currency' => 'usd',
'paypal' => '',
'give_asia' => '',
'class' => '',
'visibility' => '',
), $atts));
$classes = array('gap-element', 'clearfix');
if ($class) {
$classes[] = $class;
}
if ($visibility) {
$classes[] = $visibility;
}
$classes = implode(' ', $classes);
$donate_value = explode(",", $donate_value);
ob_start();
?>
<div class="form-donate">
<input type="text" name="" placeholder="Tôi đóng" class="form-donate__info round">
<ul class="form-donate__choice">
<?php $count = 0;
foreach ($donate_value as $value): ?>
<li title="html" data-value="<?php echo $value.$currency ?>" class="<?php if ($count == 0) echo "selected" ?>">
<div class="uppercase"><?php echo $value ?><?php echo $currency ?></div
</li>
<?php $count++; endforeach; ?>
</ul>
<button type="button" class="form-donate__paypal expand button submit is-xlarge round lowercase" data-url="<?php echo $paypal ?>">
<img src="<?php echo get_stylesheet_directory_uri()."/change/assets/img/paypal.png"?>" alt="">
</button>
<button type="button" class="expand button submit is-xlarge round lowercase"
data-url="<?php echo $give_asia ?>">Give ASIA
</button>
</div>
<?php
$content = ob_get_clean();
// ob_end_clean();
return $content;
}
add_shortcode('donate', 'donate_sc');
flatsome-child\change\builder\shortcodes\donate.php
php
Donate
<?php
add_ux_builder_shortcode('donate',array(
'name' => __("Donate"),
'options' => array(
'donate_value' => array(
'type' => 'textfield',
'heading' => 'Donate Value',
'default' => ''
),
'currency' => array(
'type' => 'select',
'heading' => 'Currency',
'default' => 'usd',
'options' => array(
'usd' => 'USD',
),
),
'paypal' => array(
'type' => 'textfield',
'heading' => 'Paypal Link',
'default' => ''
),
'give_asia' => array(
'type' => 'textfield',
'heading' => 'Give Asia',
'default' => ''
),
'advanced_options' => require( FS_THEME_SHORT_CODE_PATH . '/commons/advanced.php'),
),
));
flatsome-child\change\assets\css\pages\_page-dong-gop.scss
scss
Donate
.dong-gop--ss1{
.row2{
.col1{
.col-inner{
background-color: $white;
padding: 40px;
.form-donate{
margin: 0 auto;
max-width: 400px;
.form-donate__info{
height: 45px;
border-radius: 5px;
box-shadow: none;
margin-bottom: 10px;
}
.form-donate__choice{
list-style: none;
-js-display: flex;
display: -ms-flexbox;
display: flex;
-ms-flex-flow: row wrap;
flex-flow: row wrap;
margin-left: -10px;
margin-right: -10px;
li{
max-width: 50%;
-ms-flex-preferred-size: 50%;
flex-basis: 50%;
cursor: pointer;
display: block;
text-align: center;
margin: 0px;
padding: 10px;
div{
padding: 12px 16px;
border: 1px solid #b8b8b8;
border-radius: 4px;
}
&.selected{
div{
border-color: $green1;
}
}
}
}
.form-donate__paypal{
background-color: #FFAF50;
}
}
}
}
}
}
flatsome-child\change\assets\js\change.js
javascript
Donate
changeThemeModule.formDonate = function () {
$(".form-donate__choice").on("click", "li", function () {
$(this).addClass("selected");
$(this).siblings().removeClass("selected");
});
$(".form-donate button").click(function () {
window.open($(this).data("url")+"/"+$(".form-donate__choice li.selected").data("value"), '_blank');
})
}