I've Googled for an answer, but most posts seem to be talking about labels within forms. I have custom fields set up in content block in Drupal 7. When I show the titles (labels) of those custom fields, it adds a colon after after the title. Is there a way to remove them?
You need to override field.tpl.php to do this (the colon is hard coded into that template file).
Create field.tpl.php anywhere in your theme folder, copy the code from the above link into it, tweak it (remove the colon etc), then clear your caches: all will be well!
Override field.tpl.php and add a span (with a class) around the colon, then use CSS to hide the colon. This gives you flexibility in deciding when to hide the colon. For labels set to above you may wish to hide the colon and for labels set to inline you might want to keep the colon.
Example:
In your Drupal installation folder, look in modules/field/theme and copy field.tpl.php file to your theme.
For D7, edit field.tpl.php and change <?php print $label ?>: to <?php print $label ?><span class="field-label-colon">: </span>
In your theme CSS style sheet add .field-label-colon{display: none;} or to only hide label for label above .field-label-above .field-label-colon{display: none;}
I just want to add my grain of salt to this topic. I have been trying to do this a few time and I usually end up creating a custom template file for each field I want to remove the column, which is not a good solution in my opinion, because the presence of the label is design dependant; in a good MVC structure, this feature should be controlled by the View (CSS), not the Model (PHP template).
There is what I did this time:
Copy the file modules/field/theme/field.tpl.php into your theme.
Add a span around the column:
<?php print $label ?><span class="label-suffix">: </span>
Add CSS directives to remove the column where your design required to remove it:
#sidebar-first .label-suffix {
display: none;
}
Related
I need translated line of custom button in a code, but its not working my solution.
This is the line in file which I need translate (line 13, name of file: add-to-quote-button.php)
Quick Quote
There is my solution which is not working:
My solution
Additional informations:
name of my translated file: yith-woocommerce-request-a-quote-cs_CZ.mo
file location: plugins/woocommerce request a quote v1.6.1/templates/add-to-quote-button.php
There are two ways to do this.
One is a bit hacky and might get you into trouble if some huge change happens to woocommerce and other one is using CSS.
You could override that file in your child theme if you have one. if not you can do so in your parent theme.
Inside your theme folder create new folder 'woocommerce' and within woocommerce create 'templates' within that folder create file add-to-quote-button.php and copy whole content of the original file into this one and update that text.
Now that should overwrite woocommerce plugin file.
CSS Way would be to find class that's on that button - I'll name it 'someQuoteButton' just so I can give you an example.
.someQuoteButton {
font-size:0;
}
.someQuoteButton:after {
content: 'Some Content you Want';
font-size: 16px; // or any you need there
}
So you want to translate "Quick Quote" text in that line of code?
Try it like this:
<?php _e( 'Quick Quote', 'yith-woocommerce-request-a-quote') ?>
So I am working on making a child theme of the "twenty fifteen" theme.
So far I have made custom post types with custom fields. It is imperative that I use custom fields for adding Soundcloud embedds. I have used the "Advanced Custom Fieds" plugin to do so.
Now, the problem I have is that whenever I use the custom field to add a soundcloud widget (just by pasting the link) it seems that the WYSIWYG Editor is adding the link inside a paragraph like this
<p>https://soundcloud.com/skitofficial/skit-ghost-dog</p>
This causes (I think) a white line (a new paragraph) to appear below the Soundcloud widget.
As you can see in the picture below, if I open the code view of the WYSIWYG I can spot the paragraph lines being added around the link.
So all in all, the main problem for me here is the white space below the soundcloud widget. Perhaps it does not have to do anything with the paragraph tag, but either way I the space below the widget looks bad, unprofessional and I need to remove it somehow. Now you may say "why don't you just remove those paragraph tags?" and that is the problem, even if I remove them, they are added automatically.
So, any suggestions would be very appreciated. I have worked my head on this for three days without any progress.
Edit: this question is old and I do not have the site anymore.
I would just add this style to a global stylesheet:
.SoundcloudEmbedd p { margin: 0; }
seems safe
Wordpress WYSIWYG pops in <p> tags. If you're not careful, it will <p> all over your content.
https://codex.wordpress.org/Function_Reference/wpautop
Pop this into your functions.php
remove_filter( 'the_content', 'wpautop' );
EDIT
If you're using ACF, the text area field type has an option for whether or not to add the <p> tags. As mevius suggests, depending on your use case, you may want to consider using the URL field type.
OR, you can use this when calling the field in your theme.
the_field('wysiwyg_field', false, false);
It's possible that the WYSIWYG is adding those <p> tags, due to WordPress's wpautop function.
Rather than completely disabling wpautop, you could remove the <p> tags using a combination of get_field() and wp_strip_all_tags():
echo wp_strip_all_tags( get_field('field_name'), true );
EDIT: On second thought, why are you using a WYSIWYG for this at all? If you're just pasting a link, you should consider using a text field, or a url field.
I did not have access to the code, nor I had access to any plugins, hence I tried this only using the WYSIWYG editor.
To remove the any unwanted paragraphs from any particular web element like div just follow these steps:
add a class to your div (the div which is containing that unwanted paragraphs).
Write a javascript function using querySelectorAll.
Example Below:
var blankps=document.querySelectorAll('.removePara p');for(var i=0;i<blankps.length;i++){blankps[i].remove();}
<div class="col-xs-12 col-md-3 removePara">
<p></p>
How to Remove Empty Paragraphs. Solved.
<p></p>
</div>
Note: This will remove all the paragraphs inside any div which has class="removePara".
Hope this helps someone.
For some reason my WYSIWYG editor in Wordpress automatically adds span classes with style when I create a bullet list with the button. It's very annoying because I want my text to be a certain size, but the span class hardcodes the style and it messes the size up.
Does anyone know how to remove this automatic adding of the span class?
This site is for a customer and he/she doesn't know how to use HTML, that is why this has to work with the WYSIWYG editor.
Help much appreciated. Thanks.
I have the same problem, and I am not copying, each time I create a list, the editor adds in the code:
the text
to the text of the list.
How can I get rid of this ?
I have just find a solution that works for me in that post:
http://wordpress.org/support/topic/strange-behaviour-making-lists-in-the-visual-editor
If you use a child theme, just add this function to your functions.php file:
/**
* I want to use the basic 2012 theme but don't want TinyMCE to create
* unwanted HTML. By removing editor-style.css from the $editor_styles
* global, this code effectively undoes the call to add_editor_style()
*/
add_action( 'after_setup_theme', 'foobar_setup', 11 );
function foobar_setup() {
global $editor_styles;
$editor_styles = array();
}
Are you copying and pasting the text from somewhere? Sometimes the text will have styles in its source and the styles get carried over to the wysiwyg. See http://tentblogger.com/copy-paste/
Usually I set up pages in Wordpress by putting all the HTML in and the client will edit the content in the WYSIWYG editor
This is great, until they accidentally delete a div or break something.
What is the correct way to go about this making it idiot proof, so that they can change titles, paragraphs etc without potentially deleting parts of the structure?
If your client does not know HTML, and you know this going into the project, the only things he/she should be inputting in the page editor are words, uploaded media, and elements that can be inserted using the visual editor. It's a pain in the butt, but your theme should be the part that's "idiot proof".
Build your theme to wrap the_content(); in a div, and style all the potential elements that can be input accordingly. Only rely on elements that can be added using the CKEditor.
e.g. (within the loop, in a theme template file)
<div id="myContentDiv">
<?php the_content(); ?>
</div>
Then your CSS:
#myContentDiv p {
}
#myContentDiv ul {
}
etc.
There's a few options that comes to me right now:
Use jquery plugins to get columns (which is pretty bad IMHO)
Use a plugin with shortcodes (so you wrap each column with them), which is good but user may screw it up yet
Use custom fields (like one text area "Right column content", then you have another text area "Left column content" and so on)
All these 3 are quite easy to implement! :)
[]'s
Wordpress Tiny MCE editor and WP own editor both has button for <blockquote> . if we select any text and press this buttom then it wraps that text with <blockquote>.....</blockquote>.
I want to change this output to this
<blockquote><div class="quote_start"><div></div></div><div class="quote_end"><div></div></div>...................................</blockquote>
How can i do this manually or is there any wordpress plugin which can do the same?
I want to change behaviour of blockquote button in bot editor TinyMCE and WP own html editor?
I'm not sure you can use this to add that many divs but tinymce's valid elements config parameter does allow you to replace tags.
http://wiki.moxiecode.com/index.php/TinyMCE:Configuration/valid_elements
For instance:
tinyMCE.init({
valid_elements : "blockquote/div[class=quote_start]"
});
Would replace all blockquote tags with a div with the quote_start class.
A better way might be to ignore tinymce here and write a filter for the functions.php file of your theme. http://codex.wordpress.org/Plugin_API/Filter_Reference/the_content. Find all the instances of blockquote and replace it with the code you want.
Maybe adding your own button could also be an option?
Some starting point could be this:
http://www.deliciousdays.com/tinymcebuttons/
and/or this:
http://wiki.moxiecode.com/index.php/TinyMCE:API/tinymce.Editor/addButton
hope it helps? Greetz, t..
If you want the same functionality in two different editors, you're probably better off writing (or looking for) a Wordpress filter that can replace the code. There's this one but it doesn't seem to be able to handle regular expressions (which you would need to replace HTML tags). Maybe this one can do what you need: Text Filter Suite
Getting both TinyMCE and Quicktags requires mods in two places. Here's how to do the Quicktags:
http://website-in-a-weekend.net/extending-wordpress/diy-wordpress-unraveling-quicktags-wordpress-plugins/