I am using WordPress social media plug-in. When any user clicks on icon it opens the link in new tab, but i want it in new window, so for this purpose i am using Javascript function
<script type="text/javascript">
// Popup window code
function newPopup(url) {
popupWindow = window.open(
url,'popUpWindow','height=700,width=800,left=10,top=10,resizable=yes,scrollbars=yes,toolbar=yes,menubar=no,location=no,directories=no,status=yes')
}
</script>
But the main problem is my code is written in PHP and i don't have any idea how to use javascript function in it. Here is my PHP function.
$out_button = array(
'tag' => 'a',
'class' => 'synved-social-button synved-social-button-' . $context . ' synved-social-provider-' . $button_key . $class_extra,
'data-provider' => $button_key,
'target' => $button_key != 'mail' ? '_blank' : '',
'rel' => 'nofollow',
'title' => $title,
'href' => $href,
'child-list' => array(
array(
'tag' => 'img',
'alt' => $button_key,
'class' => 'synved-share-image',
'width' => $size,
'style' => 'width:' . $size . 'px;' . $style,
'src' => $image_uri,
)
)
);
'href' => $href, In this i have to write the Javascript function so any idea how can i do it.
It looks as though your php array should be setting the target to _blank if the key isn't mail. If you just set
'target' => '_blank',
does that give you your desired result?
How about adding an onclick event handler?
onclick = "Some_JavascriptFunction()"
then in javascript you can use window.location.href = "someURL.php";
Related
I am wanting to add a link to the Wordpress admin bar that will eventually purge all cache. At the moment I am trying to add the link to the admin bar but seem to be having problems.
I have followed a few methods I had found on Google, but for some reason I couldn't get them to work. (I don't know if this is due to the examples being outdated with the version of Wordpress?)
Here is what I am using so far:
function time_to_purge($wp_admin_bar) {
$args = array(
'id' => 'DaylesPurge',
'title' => 'Purge Cache',
'href' => '#',
'meta' => array(
'class' => 'DaylesPurge'
)
);
$wp_admin_bar->add_node($args);
}
add_action('admin_bar_menu', 'time_to_purge', 50);
function PurgeConfirmation() {
document.getElementById("PurgeConfirmation").innerHTML = "Are you sure you
wish to purge the cash?";
}
[EDIT]
Never-mind, this works perfectly. It was a matter of a simple spelling mistake in my code that was preventing it from displaying.
function time_to_purge($wp_admin_bar) {
$args = array(
'id' => 'DaylesPurge',
'title' => 'Purge Cache',
'href' => '#',
'meta' => array(
'class' => 'DaylesPurge'
)
);
$wp_admin_bar->add_node($args);
}
add_action('admin_bar_menu', 'time_to_purge', 50);
function PurgeConfirmation() {
document.getElementById("PurgeConfirmation").innerHTML = "Are you sure you
wish to purge the cash?";
}
I am using codeigniter and I need to have a popup window. I used the anchor_popup function. Here is my code:
<?php
$attributes = array(
'class' => 'blue-button',
'width' => '800',
'height' => '600',
'resizable' => 'no',
'screenx' => '\'+((parseInt(screen.width) - 800)/2)+\'',
'screeny' => '\'+((parseInt(screen.height) - 600)/2)+\'',
);
echo anchor_popup('admin/employee/add', 'Start Worksheet', $attributes);
?>
This opens a new window with the close, minimize, and maximize buttons But I need to disable or hide the minimize and maximize buttons. How can I do this?
I am trying to style the check symbol (✓) in my member profile tab on a Buddypress site. The tab is created in my functions.php file in my child theme shown in the code below. I want to make the check symbol green and bold. Because this is in PHP and part of a function I don't know how to accomplish this. Any ideas would be appreciated.
add_action('after_setup_theme','kleo_my_custom_tabs');
function kleo_my_custom_tabs()
{
global $bp_tabs;
$bp_tabs = array(); $bp_tabs['verify'] = array(
'type' => 'regular',
'name' => __('Verified ✓', 'kleo_framework'),
'group' => 'Verify',
'class' => 'regulartab'
);
}
Try this:
'Verified <b style=\'color:#009900;\'>✓</b>'
add_action('after_setup_theme','kleo_my_custom_tabs');
function kleo_my_custom_tabs()
{
global $bp_tabs;
$bp_tabs = array(); $bp_tabs['verify'] = array(
'type' => 'regular',
'name' => __('Verified <b style="color:green;">✓</b>', 'kleo_framework'),
'group' => 'Verify',
'class' => 'regulartab'
);
}
I have a content type (budget), it is a custom content type
function budget_node_info() {
return array(
'budget' => array(
'base' => 'budget',
'name' => t('Budget'),
'description' => t('Represents individual budget.'),
'title_label' => t('Budget Name'),
'locked' => TRUE
)
);
}
also I have the form function
function budget_form($node, $form_state) {
drupal_add_library('system', 'ui.tabs');
drupal_add_library('budget', 'highcharts');
drupal_add_js(drupal_get_path('module', 'budget') . '/js/budget_base.js');
drupal_add_js(drupal_get_path('module', 'budget') . '/js/' . $node->type . '.js');
$form = node_content_form($node, $form_state);
$config = variable_get($node->type);
I want to show the edit form on the node view page (I want to show form from node/[nid]/edit to node/[nid])?
I tried next:
function budget_node_view($node, $view_mode, $langcode){
$node->content['edit-form'] = array(
'#markup' => render(drupal_get_form('budget_form', $node)),
'#weight' => 10,
);
}
also I tried
function budget_node_view($node, $view_mode, $langcode){
$node->content['edit-form'] = array(
'#markup' => render(budget_form($node, array())),
'#weight' => 10,
);
}
2nd version show form but without any js or css loaded.
What am I doing wrong?
I used function node_page_edit($node) and seems like it works
function wp_budget_node_view($node, $view_mode, $langcode){
module_load_include('inc', 'node', 'node.pages');
$node->content['edit-form'] = array(
'#markup' => render(node_page_edit($node)),
'#weight' => 10,
);
}
also for new (empty) form you should use node_add function function node_add($type
I am using Yii Booster Yii extension for UI. I need to update the content of the tabs using ajax. Using below code I am able to get the content using renderPartial but instead I want to make ajax call and update the content.
$this->widget('bootstrap.widgets.TbTabs', array(
'type' => 'tabs',
'tabs' => array(
array('label' => 'Home', 'content' => $this->renderPartial('home', NULL, true), 'active' => true),
array('label' => 'Test', 'items' => array(
array('label' => 'Sub Tab 1', 'content' => $this->renderPartial('testpage', NULL, true)),
array('label' => 'Sub Tab 2', 'content' => 'some content ')
)),
)
)
);
Do I need to use jquery or something else to work with Yii Booster widgets ?. This is the first time I am using php/yii/extensions.
I am a bit confused so Yii Booster has integrated Bootstrap widgets so that they can be used with php. But for client side do I need to use jquery to manipulate bootstrap widgets ?
Are there any tutorials for using Yii Booster, I know the link to yii booster site, but there we just have simple examples nothing related to events, ajax.
Got this working. As #Sergey said I need to use 'shown' event. I gave ids to each tab to identify specific tab and load content. Here is the code
<?php $this->widget('bootstrap.widgets.TbTabs', array(
'id' => 'mytabs',
'type' => 'tabs',
'tabs' => array(
array('id' => 'tab1', 'label' => 'Tab 1', 'content' => $this->renderPartial('tab1', null, true), 'active' => true),
array('id' => 'tab2', 'label' => 'Tab 2', 'content' => 'loading ....'),
array('id' => 'tab3', 'label' => 'Tab 3', 'content' => 'loading ....'),
),
'events'=>array('shown'=>'js:loadContent')
)
);?>
We have 3 tabs, the content will be loaded using loadContent javascript function.
<script type="text/javascript">
function loadContent(e){
var tabId = e.target.getAttribute("href");
var ctUrl = '';
if(tabId == '#tab1') {
ctUrl = 'url to get tab 1 content';
} else if(tabId == '#tab2') {
ctUrl = 'url to get tab 2 content';
} else if(tabId == '#tab3') {
ctUrl = 'url to get tab 3 content';
}
if(ctUrl != '') {
$.ajax({
url : ctUrl,
type : 'POST',
dataType : 'html',
cache : false,
success : function(html)
{
jQuery(tabId).html(html);
},
error:function(){
alert('Request failed');
}
});
}
preventDefault();
return false;
}
Here we get the target, that should be the anchor element of the tab that we clicked, get the href value which should be the id that we configured. Decide the url based on this id, load content and update the div's. The id of div's are the same as href.
I haven't found way to load content of the initial active tab, there should be way to fire loadContent function, for now I have used renderPartial to get the content instead
I extended the TbTabs class with #Abdullahs example. It's tested with YiiBooster, but should work with other Bootstrap plugins as well.
Usage:
$this->widget(
'ext.ajaxTabs.widgets.ajaxTabs',
array(
'reload' => true, // Reload the tab content each time a tab is clicked. Delete this line to load it only once.
'tabs' => array(
array(
'label' => 'Static',
'content' => 'Static content'
),
array(
'label' => 'Static rendered',
'content' => $this->renderPartial('index', null, true),
),
// And finally AJAX:
array(
'label' => 'AJAX',
'content' => 'loading ....',
'linkOptions' => array('data-tab-url' => Yii::app()->createAbsoluteUrl('site/'))
)
),
)
);
/protected/extensions/ajaxTabs/widget/ajaxTabs.php:
<?php
Yii::import('bootstrap.widgets.TbTabs');
class ajaxTabs extends TbTabs
{
/**
* #var bool Reload the tab content each time the tab is clicked. Default: load only once
*/
public $reload = false;
public function run()
{
$id = $this->id;
/** #var CClientScript $cs */
$cs = Yii::app()->getClientScript();
$cs->registerScript(
__CLASS__ . '#' . $id . '_ajax', '
function TbTabsAjax(e) {
e.preventDefault();
var $eTarget = $(e.target);
var $tab = $($eTarget.attr("href"));
var ctUrl = $eTarget.data("tab-url");
if (ctUrl != "" && ctUrl !== undefined) {
$.ajax({
url: ctUrl,
type: "POST",
dataType: "html",
cache: false,
success: function (html) {
$tab.html(html);
},
error: function () {
alert("Request failed");
}
});
}
if(' . ($this->reload ? 0 : 1) . '){
$eTarget.data("tab-url", "");
}
return false;
}'
);
$this->events['shown'] = 'js:TbTabsAjax';
parent::run();
}
}
Its a new version to loadContent
function loadContent(e){
var targetUrl = e.target.getAttribute('data-tab-url');
var contentID = e.target.getAttribute('href');
$(contentID).load(targetUrl, function(){
$('.tabs').tabs(); //reinitialize tabs
});
e.preventDefault();
return false;}