i have a form below i m trying to apply class to it so that forms are next to each other rather than one below the other but its not working
below is my code
<form action="" method="POST">
<div class="imgthumb"><?php the_post_thumbnail('thumbnail'); ?></div>
<div class="votebtn">
<input type="hidden" value="<?php echo $postid; ?>" name="id" />
<input type="submit" name="submit" value="Vote" />
</div?
<div class="votecounttxt"><?php echo $votecount; ?></div>
</form>
u caa see it live at http://myproject.byethost7.com/?page_id=5
There are a number of approaches, either change the display for the form or use a float, in this instance:
form {
display: inline-block;
}
Should do it for you. Your forms are currently displaying as block content, taking up an entire 'line' instead of simply the width of their content and allowing subsequent content to 'flow' after it on the same line. Changing to inline-block will change them to do this. Floating works in a similar way from a visual perspective, however may have unforseen consequences so is likely not necessary here.
ok i got it i just had to include the styles css directly in the template...since template didn't have getheader the stylesheet was not getting loaded
Related
I am developing a WordPress plugin that is inserted onto the page by adding a token to the page content.
So, on the page there is some introductory text with the contents of the plugin below. On postback, I would like to clear the introductory text and just show output from the plugin.
I know I could do this using jQuery by replacing the contents of $(".entry-content").html("plugin output"); but I wanted to ask if there was a WordPress native method of doing this instead.
UPDATE
The following is one of the files from the plugin. It is on the POST (the if condition) that I want to replace the page content, with the output of the function. On the GET (the else condition) I just want to append the output of the function to the content.
<?php
/*
The following code utilizes Heredoc syntax.
It is very important to note that the line with the closing identifier must contain no other characters, except a semicolon (;).
That means especially that the identifier may not be indented, and there may not be any spaces or tabs before or after the semicolon.
It's also important to realize that the first character before the closing identifier must be a newline as defined by the local operating system.
This is \n on UNIX systems, including Mac OS X.
The closing delimiter must also be followed by a newline.
*/
class WHRFContactUs {
function GenerateContactUsForm() {
if ($_SERVER['REQUEST_METHOD'] == 'POST')
{
$sendgrid = new SendGrid($GLOBALS['MailAPIKey']);
$email = new SendGrid\Email();
$email
->addTo($GLOBALS['MailAPISender'])
->setReplyTo($_POST['Email'])
->setFrom($GLOBALS['MailAPISender'])
->setSubject($_POST['Subject'])
->setHtml($_POST['Message'] . '<br /><hr/>' . $_POST['FullName'] . ' ' . '(' . $_POST['Email'] . ')<br/>' . '<br />')
;
try
{
$sendgrid->send($email);
$html = <<<HTML
Your message has been successfully sent. Thank you for taking the time to provide us your feedback.
<br/><br/>
In the event that your feedback requires a response, a representative will contact you as soon as possible.
HTML;
}
catch(\SendGrid\Exception $ex)
{
echo $ex->getCode();
foreach($ex->getErrors() as $er) {
echo $er;
}
}
}
else
{
$html = <<<HTML
<form method="post" id="ContactUsForm" action="{$_SERVER['REQUEST_URI']}">
<div class="form-group">
<label for="FullName" class="sr-only">Your full name</label>
<input type="text" class="form-control" id="FullName" name="FullName" placeholder="Your full name" data-validation-required="Please enter your full name.">
</div>
<div class="form-group">
<label for="Email" class="sr-only">Your email address</label>
<input type="email" class="form-control" id="Email" name="Email" placeholder="Your email address" data-validation-required="Please enter your email address." data-validation-format="Please enter a valid email address.">
</div>
<div class="form-group">
<label for="Subject" class="sr-only">Subject</label>
<input type="text" class="form-control" id="Subject" name="Subject" placeholder="Subject" data-validation-required="Please enter a subject.">
</div>
<div class="form-group">
<label for="Message" class="sr-only">Message</label>
<textarea class="form-control" id="Message" name="Message" placeholder="Your message..." data-validation-required="Please enter a message." rows="4"></textarea>
</div>
<button type="submit" id="ContactUsFormSubmit" name="ContactUsFormSubmit" class="btn btn-primary">Send message</button>
</form>
<script type="application/javascript" src="{$GLOBALS['WHRFPluginPath']}scripts/whrf-contact-us.js"></script>
HTML;
}
return $html;
}
}
add_shortcode('ContactUsForm', array('WHRFContactUs','GenerateContactUsForm'));
?>
As mentioned in the comments, without knowing how that content is being added it isn't really possible to know how to replace it.
However, there's a possibility of achieving that in a very disruptive and ill-advised way:
Chances are that content is being added by using the filter the_content.
So you could disruptively have a high-priority modification for the content and then remove that filter to stop the other content from being added. As follows:
function my_disruptive_filter($content) {
remove_all_filters('the_content');
return 'my custom content';
}
add_filter( 'the_content', 'my_disruptive_filter', -999, 1);
I'm not 100% sure if a this would work, since I've never tried it.
Also remove_all_filters takes a second parameter that's $priority which is optional. You can target all priorities that are lower that the one using with this hook, via a for loop. But I assume without providing that parameter it would just remove all of them.
Warning
The reason that this is very disruptive is that it would prevent any other code from using that filter. Another developer (or even yourself) might want to use that filter later at some point and it won't work and you have no idea why. Could be a very difficult situation to get out of.
Also this might prevent existing plugin theme from adding their content, so if you wind up using and see missing stuff -- the reason could be this.
Note: this is really a hit-or-miss solution because it depends on how that content is being added.
The function the_content() returns the page content, if you want to overwrite this using your own plugin you should remove this line in whatever page you are (usually page.php/single.php in theme dir) with your custom plugin output.
I noticed a strange bug when testing out one of our Wordpress apps.
I have a form with an input field and if I type a number such as "3" anywhere in the input text Wordpress will throw a 404:
<input name="author" type="text" />
If I change the name attribute from author to anything else, it works fine:
<input name="bob" type="text" />
I'm not a Wordpress guru or even a PHP dev so I apologize if this is trivial. I've stripped out everything possible from this PHP page. Is there some Wordpress magic going on here where "author" is some sort of reserved word? Here's the entire PHP file (the header is a simple nav-bar and the footer just calls wp_footer()....):
<?php
/**
* Template Name: MyTemplate
*/
get_header();
if(isset($_POST['submitted'])):
echo "<H4>Submitted!</H4>";
else:
?>
<form id="my-form" action="<?php the_permalink(); ?>" method="post">
<input name="author" type="text" /><br/><br/>
<input type="hidden" name="submitted" id="submitted" value="true" />
<input type="submit" value="Submit"/>
</form>
<?php
endif;
get_footer();
OK wow.. So it looks like there are reserved words in form posts:
http://codex.wordpress.org/Function_Reference/register_taxonomy#Reserved_Terms
Sorry for such a novice question.
I am working on a plugin, which creates a couple of Virtual pages, and I wish these links to be available in Menu admin page, to let users have the liberty to add them as they create menus.
I want to add a Meta box in Menu administration, very similar to Page/Category meta boxes, to let users select what page to add in their menu.
Apparently, the only possible research is in the core itself.
Here, /wp-includes/nav-menu.php, we can get how to insert the meta box:
add_action('admin_init', 'so_13875144_nav_menu_meta_box');
function so_13875144_nav_menu_meta_box() {
add_meta_box(
'my-custom-nav-box',
__('Custom Box'),
'so_13875144_display_menu_custom_box',
'nav-menus',
'side',
'default'
);
}
function so_13875144_display_menu_custom_box() {
/* Not sure about this global var */
//global $_nav_menu_placeholder;
//$_nav_menu_placeholder = ( 0 > $_nav_menu_placeholder ) ? intval($_nav_menu_placeholder) - 1 : -1;
?>
<p id="menu-item-custom-box">
<label class="howto" for="custom-menu-item-custom-box">
<span><?php _e('URL'); ?></span>
<input id="custom-menu-item-custom-box" name="menu-item[<?php echo $_nav_menu_placeholder; ?>][menu-item-custom-box]" type="text" class="code menu-item-textbox" value="my text" />
</label>
</p>
<?php
}
But, the hard part, which I haven't managed to make work, is to save the value.
This is the file /wp-admin/nav-menus.php that has to be studied.
Tried to hook into the action wp_update_nav_menu, but the custom meta box input field is not being passed into $_POST.
WordPress Answers may have some hint: https://wordpress.stackexchange.com/search?q=wp_update_nav_menu
http://codex.wordpress.org/Function_Reference/add_meta_box
Use the post_type 'nav-menus'
I know I'm late to the party but just for anyone else trying to do this...
b__ is right, that is the way to get it to show on the page except it is much easier to use checkboxes than any other field because there is an inbuilt javascript function that looks for checkboxes.
All you need to do is copy the html from an existing checkbox -
<li><label class="menu-item-title"><input type="checkbox" class="menu-item-checkbox" name="menu-item[-1][menu-item-object-id]" value="2"> Sample Page</label><input type="hidden" class="menu-item-db-id" name="menu-item[-1][menu-item-db-id]" value="0"><input type="hidden" class="menu-item-object" name="menu-item[-1][menu-item-object]" value="page"><input type="hidden" class="menu-item-parent-id" name="menu-item[-1][menu-item-parent-id]" value="0"><input type="hidden" class="menu-item-type" name="menu-item[-1][menu-item-type]" value="post_type"><input type="hidden" class="menu-item-title" name="menu-item[-1][menu-item-title]" value="Sample Page"><input type="hidden" class="menu-item-url" name="menu-item[-1][menu-item-url]" value=""><input type="hidden" class="menu-item-target" name="menu-item[-1][menu-item-target]" value=""><input type="hidden" class="menu-item-attr_title" name="menu-item[-1][menu-item-attr_title]" value=""><input type="hidden" class="menu-item-classes" name="menu-item[-1][menu-item-classes]" value=""><input type="hidden" class="menu-item-xfn" name="menu-item[-1][menu-item-xfn]" value=""></li>
but give them each a unique ID and put your details in for the URL, title etc.
Then, add a submit button at the end to add to the menu -
<input type="submit" class="button-secondary submit-add-to-menu right" value="<?php esc_attr_e('Add to Menu'); ?>" name="YOUR NAME" id="YOUR ID" onclick="(function(){$('#THE DIV YOU HAVE PUT YOUR LIST IN').addSelectedToMenu( api.addMenuItemToBottom );})"/>
And that should add the item to the list.
This is a pretty old question but I was trying to do this today so in case it points anyone in the right direction...
I won't cover adding the meta box, as it's covered above. I'll also only cover a custom link as I haven't looked into adding a post, page, term link etc.
Just to cover the logic of how I got there...Looking at wp-admin/js/nav-menu.js, for a custom link you'll want to use window.wpNavMenu.addItemToMenu(). This ajax submits to the function wp_ajax_add_menu_item() in wp-admin/includes/ajax-actions.php. This then submits to wp_save_nav_menu_items() in wp-admin/includes/nav-menu.php. The upshot from looking at these files is that all menu items are of a post_type, taxonomy, post_type_archive or custom type.
Hook the javascript to the HTML as you wish, but if you want to submit a custom link, you need to call addItemToMenu() as follows:
var url = 'http://example.com';
var title = 'Link text';
window.wpNavMenu.addItemToMenu({
'-1': {
'menu-item-type': 'custom',
'menu-item-url': url,
'menu-item-title': title,
}
}, window.wpNavMenu.addMenuItemToBottom);
Menu item type has to be "custom" otherwise it requires info for a post, page etc. with which to associate the menu item.
I am trying to customise the output code of
<?php comment_form(); ?>
At the moment the submit button outputs the following:
<p class="form-submit">
<input name="submit" type="submit" id="submit" value="Post Comment">
<input type="hidden" name="comment_post_ID" value="486" id="comment_post_ID">
<input type="hidden" name="comment_parent" id="comment_parent" value="0">
</p>
I would like it to output the following:
<div class="darkbutton" onclick="document.commentform.submit()">
<span class="darkbutton-left"></span>Log In
<span class="darkbutton-right"></span>
</div>
so as the completely restyle the button. Now I know it could be done by editing the core Wordpress files in comment-template.php but I really don't want to have to do this if there is any other way.
Any suggestions greatly appreciated! :)
Have a trick
.form-submit{display: none;}
You can following after
$args = array(
'comment_notes_after' => '<button type="submit" id="submit-new"><span>'.__('Post Comment').'</span></button>'
);
comment_form($args);
I needed to add a class to form tag and the submit button. I don't know where I found it, but this solution helped me out. You have to modify the str_replace to suite your needs.
ob_start();
comment_form($comments_args, $post_id);
$form = ob_get_clean();
$form = str_replace('class="comment-form"','class="comment-form my-class"', $form);
echo str_replace('id="submit"','class="btn btn-warning"', $form);
Wrodpress has "Pluggable Functions" That allow you to overwrite some core functions. This is useful because they won't overwrite your changes when upgrading and such. However, it does not look like the comment_form() is one of them.
If you're looking to avoid modifying core files, why not just edit your template file to output your desired code instead of calling the comment_form() function? Otherwise, I'm pretty sure you're just going to have to modify that file.
You can read some discussion about this issue here, but it doesn't look like any fixes have been made to the WP codebase.
For now, I'm making style changes to my button on client side with jQuery. You could generate your <div> block with jQuery, and then hide their form-submit block by doing this:
.form-submit {
display: none;
}
This isn't foolproof code, but it's a hack that will work until they implement something better.
This is my code:
Enter your question here:
<form method="post" action="">
Title:
<input type="text" name="title">
<br>Further Explanation:<br>
<textarea name="content" rows="5"></textarea><br>
<input type="submit" name="input" value="Ask" />
<?php
if(isset($_POST['delete'])) {
include "connection.php";
if (mysql_query("TRUNCATE TABLE Questions"))
{
echo "Pitanje je uspesno obrisano";
} else {
echo "Nastala je greška pri brisanju pitanja<br>" . mysql_error();
}
}
?>
</form>
<form action="
<?php
$_SERVER['PHP_SELF'];
?>
" method="post">
<input type="submit" name="delete" value="delete all questions">
</form>
Now, this is what should my form normally look like:
But this is what happens when I put in or out of the div tag inside my dynamic page file:
http://tinypic.com/images/404.gif
What am I doing wrong? what is going on? :(
I'm not a CSS pro, but what I'd recommend is firing this up in Firefox after you download the add-on Firebug. Firebug will let you get right in there and mess with the CSS and HTML while it is running in the browser, so you can adjust things on the fly, turn on and off css elements, and isolate exactly what is causing the problem. Just find the div in the Firebug window and it will list every css element currently attached to it. From there, you should be able to move through the code and see where that weird CSS is coming from.
You probably have some CSS rules that change the appearance of input and textarea elements, probably something like:
input, textarea {
border: none;
}
That’s why your input and textarea elements do not have a border. And the centered align might be inherited from a parent element.