I am new to handlebar js and I am building a ghost blog theme. In the below line of code, the % symbol is used to display the number of posts.
<div>
`{{plural meta.pagination.total empty='No posts' singular='% post' plural='See all % posts'}}
</div>
I didn't get how this is working, I haven't seen any documentation on what's the use of % symbol in handlebar js.
Can someone help me in understanding this better?
The % symbol is the placeholder for the value, and will be replaced with the number returned from meta.pagination.total.
Related
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.
I've been playing around with a theme for a ghost blog (ghost.org). It uses handlebars for its templates and I've been looking at existing ones to see what is possible and what isn't.
I have come across {{!< default}}. default is the name of a template.
What does !< mean?
If you look in the index.hbs file of the default theme you'll find this comment:
{{! The comment above "< default" means - insert everything in this file into
the {body} of the default.hbs template, which contains our header/footer. }}
It simply tells the page which parent template it should be inserted into
According to official page section about comments, {{! }} is used to mark a template comment. So, basically < default - just a comment which is simply being ignored.
EDIT:
Also in mustache man page it's clearly stated:
Comments begin with a bang and are ignored.
So, I presume, it's safe to say, that if tag starts with !, it's not going to be rendered.
I am trying to add a button to my WordPress template. Basically, I have the post and then there is the Related Posts Thumbnails widget that appears. I want the button to go between the text of the post and the related posts thumbnail widget. The code in my 'Single Post' that contains all of this is as follows:
<div class="post-content">
<?php the_content(__('<em><strong>More:</strong> Read the rest of this entry...</em>', 'life-is-simple')); ?>
</div>
I know the Related Posts Thumbnails plugin falls within this code because it's at that place when I 'Inspect Element' on Google Chrome. I can't find how to edit the order of things within that div though. Any help would be greatly appreciated, thanks!
EDIT
Clarification: I am using the Life Is Simple WordPress theme although it has been custom editing quite a bit (mostly on the CSS side of things though).
That plugin is probably appending the output to the_content with a filter .
That means , that the output is being added to the_content automatically. it is a common behaviour.
You need to look at the plugin´s admin interface to see if you can have an alternative way (I believe there is ) which is using a template tag. in that case, you should put the template tag after the div where the the_content() is .
EDIT I :
After a small dig, - in fact there is - you need to put
<?php get_related_posts_thumbnails(); ?>
Then the plugin should know by itself not to append to the_content.
For parameter passing, or if something is not working, go read their APi or help files.
You'll probably need to edit single.php or archive.php in your theme. If nothing is occuring there that looks familiar, it's probably using a loop. In which case you might find what you are looking for either in loop.php, loop-single.php, or loop-archive.php depending on what type of page you are on and how the theme was constructed. Add your button near where you find Read the rest of this entry...
With more information (such as what theme you are using), one might be able to help more as well.
Quick question about WordPress. I've been Googling all over the place and cannot find an answer.
Basically I'm looking to replicate what happens when you add a gallery: have an image displayed as a stand in for the gallery shortcode [gallery]. The shortcode's visible when you go to edit HTML.
I'd like to exactly copy this effect: When a shortcode inserted into the editor I'd like for to to be rendered as an image.
Things I've Tried:
Inserting an element (image, div, I found an input is pretty unfuckwithable, etc) that's wrapped by a shortcode (This works ok, not great. The short code's still visible and WP will auto add paragraphs to the element to create space that users could, possibly, add content that'll be eaten by the short code) -
Inerting the short code as a < !-- --> comment (This also doesn't work great, WP will occassionally eat it moving between Visual/HTML. The comments ALSO eat your content < !-- [shortcode]--> placeholder < !--[/shortcode] --> = < !-- rendered shortcode -->)
That's the extent that I've thought of things. I cannot find a guide on how to do mimic the [gallery]'s behavior and can't find it by going through wp-admin's guts.
Thanks!
Alright, found the answer thanks to Dan's hint. Here's how to do it:
First (as Dan suggested) take a look at how they add the Gallery plugin to Tiny MCE. There's actually an uncompressed js file that will give you the overview you need, find it in:
/wp-includes/js/tinymce/plugins/wpgallery/editor_plugin.dev.js
This goes over the basics on adding this type of plugin to TinyMCE (more info here). To get WP to load the .js file with your TinyMCE plugin, see this helpful guide.
Basically here's the code:
if ( get_user_option('rich_editing') == 'true') {
add_filter("mce_external_plugins", "add_jolokia_tinymce_plugin");
//Applying the filter if you're using the rich text editor
}
function add_jolokia_tinymce_plugin($plugin_array) {
$plugin_array['example'] = '/path/to/example.js';
return $plugin_array;
}
Add this to a plugin or function.php in a theme And you're good!
Hello i'm using widgets_on_pages to place widgets on pages, i installed it and added a widget to the panel in my admin section, then i added [widgets_on_pages id=2] ("its the 2nd sidebar and it said i should add this") into my html on the place where the widget should appear but it only shows the code i added in pure text, nothing else happens, anyone know what i'm doing wrong?
If I understand correctly then the following applies... if not, apologies.
You should not need to do it this way. It seems that Vincent, you are trying to add the shortcode into a theme php file... this is incorrect and the shortcode is for adding into the page/post content by the post/page editor.
To add a Widgets on Pages sidebar to a template then v 0.0.7 (I believe) has built in template tags (see link text). This should allow you to add the following I think
<?php widgets_on_template("2"); ?>
Try this
<?php echo do_shortcode('[widgets_on_pages id=2]'] ?>