space between the radio button and label Cakephp - css

i am newbie in Cakephp trying to create a space between radio box and a label
<span class="label"><b>Gender</b></span>
<?php $options=array('M'=>'Male'."<br>" , 'F'=>'Female');
$attributes=array('legend'=>false,'label'=>'gender_male.','class'=>'radio');
echo $this->Form->radio('gender',$options,$attributes);?>
</div>
i have created a radio box in Cakephp but there is no space between the box and label is coming ... how can i create a space .

Adding margin or padding to one of the elements depending on your design goals.
This is not a CakePHP issue but a CSS styling task. See http://www.w3schools.com/css/

You can simply use the following code:
<style type="text/css">
label{padding-left:5px;}
</style>
<span class="label"><b>Gender</b></span>
<?php $options=array('M'=>'Male'."<br>" , 'F'=>'Female');
$attributes=array('legend'=>false,'label'=>'gender_male.','class'=>'radio', 'div' => false, 'separator' => '');
echo $this->Form->radio('gender',$options, $attributes);?>

You can use labels in styled span with padding but don't forget to use escape False otherwise it will show you the entire span. Please see the <span style="padding:0 15px 0 15px;">No</span> part of the code.
<?php
echo $this->Form->radio('lifestyle_drinking',
[
[ 'value' => '0', 'text' => '<span style="padding:0 15px 0 15px;">No</span>'],
[ 'value' => '1', 'text' => 'Yes'],
[ 'value' => '2', 'text' => 'Ocassionally']
],
[ 'div' => false,
'class' => 'form-control col-xs-10 col-sm-10',
**'escape' => false**
]);
?>

Try it
<span class="label"><b>Gender</b></span>
<?php
$options=array('M'=>' Male'."<br>" , 'F'=>' Female');
$attributes=array('legend'=>false,'label'=>'gender_male.','class'=>'radio');
echo $this->Form->radio('gender',$options,$attributes);?>
</div>

Related

Why is HTML rendering as Plain Text in a simple 'title' alteration?

I have been able to change each node's Comment Link 'title' text (that on default renders 'Add new comment') with the below code, but if I add HTML, it renders as plain text. I'm trying to add a FontAwesome icon before this text <i class="fa fa-comments" aria-hidden="true"></i>
function MODULE_node_view_alter(&$build) {
$node = $build['#node'];
if (isset($build['links']['comment']['#links']['comment-add'])) {
$build['links']['comment']['#links']['comment-add']['title'] = '<i class="fa fa-comments" aria-hidden="true"></i> Add Comment';
}
}
All I have passed is a $build parameter, but I am unsure of whether or not this is the issue.
Any ideas?
You can render HTML in links by setting the html option to TRUE.
Check theme_links() to see all options.
For example
theme('links', array(
'links' => array(
'title' => '<span>Title</span>',
'href' => 'node/1',
'html' => FALSE, // default
)
))
would result in the span tag being escaped, while
theme('links', array(
'links' => array(
'title' => '<span>Title</span>',
'href' => 'node/1',
'html' => TRUE,
)
))
would render the span tag as html.
So in your case you need to add the following row.
$build['links']['comment']['#links']['comment-add']['html] = TRUE;
If you can't include html in that field, as that is the type of field which may need to remain as plain text and translatable, you can use css to prepend the icon.
a:before {
font-family: FontAwesome;
content: "\f086";
}
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"/>
<a>Add Comment</a>

Add anchor tag to wordpress site header customization

I have a Wordpress site that needs some fixes and one of my issues is, that I can't add an anchor tag to the Customize page options list. What I mean is the following:
This is my information module that I can change, but for now it accepts only the <strong> tags along with some others that have been added to the array() that it is using. Here is the code that is working for me now, but as you can see, the anchor has been hardcoded into it:
<div class="text">
<a id="mainPhone" href="tel:02086109182">
<?php echo wp_kses( nl2br( $header_phone ), array( 'br' => array(), 'strong' => array(), 'span' => array() ) ); ?>
</a>
</div>
How can I switch from this to something like this:
<div class="text">
<?php echo wp_kses( nl2br( $header_phone ), array( 'br' => array(), 'strong' => array(), 'a' => array(), 'span' => array() ) ); ?>
</div>
I have added 'a' => array() to it, and as it seems it adds an anchor to the content (it gets underlined and etc.) but It is not clickable (my guess is that the href attribute needs to be added in some way?).
How can I do this? Thanks in advance!

Yii2. Button jumps on next line after Pjax wrap added

I use Yii2. I have 3 buttons in one line.
If I wrap for example the last one into the Pjax it jumps to next line.
How to correct the Pjax css class to avoid such jump?
Pjax::begin(['id' => 'pjax'.$model->id]);
echo Html::button('<span class="glyphicon glyphicon-user" aria-hidden="true"></span><span id ="projectbadge'.$model->id.'" class="badge badge-notify">'.count($model->votes).'</span>', [
'value' => Url::to(['project/votes', 'id'=>$model->id]),
'class' => 'linkbutton',
'id'=>'projectVotes'.$model->id,
'data-toggle'=>'tooltip',
'title'=> 'Votes',
'onfocus' => 'blur();'
]);
Pjax::end();
By default Pjax uses a div so you can set the style to inline
Pjax::begin(['id' => 'pjax', 'options' => ['style' => 'display: inline;']]);
or if you're on 2.0.7+ you can change the tag
Pjax::begin(['id' => 'pjax', 'options' => ['tag' => 'span']]);

Nested elements in TinyMCE "Styles" dropdown

I've been using "tiny_mce_before_init" in WordPress to add my own custom styles to the style dropdown in the editor.
Everything has been working fine but now I need to add a style that doesn't just add one element but two. Do you know if that's possible?
Here's how I'm adding single elements:
<?php
add_filter('tiny_mce_before_init', 'my_tinymce_styles');
function my_tinymce_styles ($init) {
$styles = array(
array(
'title' => 'Small',
'inline' => 'small',
'wrapper' => false
),
array(
'title' => 'Bar',
'block' => 'div',
'classes' => 'bar',
'wrapper' => true
)
# Etc...
);
# Insert the array, JSON ENCODED, into 'style_formats'
$init['style_formats'] = json_encode($styles);
return $init;
}
And this works as expected. The user selects some text, chooses "Bar" from the "Styles" dropdown and the text is wrapped in <div class="bar">...</div>.
However, now I need to do that same but add <div class="section"><div class="inner">TEXT_HERE</div></div> - how can I do that?

cakephp, giving a cake form custom styling

How to I over ride the basic styling for a form in cakePHP? I think the default limits the width of a form to 40% but I need one of my forms to be 100%.
Is something like this the way to go?
<?php echo $this->Form->create('Quote', array('novalidate' => true, 'div' => array('class' => 'div-class'), 'before' => '<div class="quotes-form">', 'after' => '</div>')); ?>
There's any number of ways to do this.
One way would be to do what you're doing. Another would be to not bother with that, and just edit Cake's default css directly, so all forms get styled the way you want.
UPDATE:
You could just do it like this:
<div class="quotes-form">
<?php echo $this->Form->create('Quote', array('novalidate' => true, 'div' => array('class' => 'div-class'))); ?>
<?php // rest of your form elements go here ?>
</div>
Then your css can just be like
.quotes-form form {
background: red;
}

Resources