WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] Add quotes using shortcode (22 posts)

  1. cableghost
    Member
    Posted 2 years ago #

    I would like the ability to add opening and ending quotes '<q></q>' using a shortcode.

    I know shortcodes cannot add curling q's to quoted text, but all I want this shortcode to do is to wrap selected text in <q> brackets.

    So, in a View Page Source DOM, text would look like...

    <p><q>this would be the quoted text</q></p>

    Reasons why...browsers today auto-add the curly q's upon seeing <q>, and search engines recognize them as specific quoted text, giving them more weight than just using a class to create the affect.

    As far as why creating a shortcode...I can had one simple button to TinyMCE, then I can highlight the text and click the respective button to add the <q> brackets.

  2. Why not use <blockquote></blockquote> instead?

  3. cableghost
    Member
    Posted 2 years ago #

    Well, blockquote is much different than <q> quotes, in terms of appearance, how search engines view it, and it is 'block', not inline.

  4. esmi
    Theme Diva & Forum Moderator
    Posted 2 years ago #

    browsers today auto-add the curly q's upon seeing <q>, and search engines recognize them as specific quoted text, giving them more weight than just using a class to create the affect.

    They also recognise the blockquote tag which, given your example above, would be the semantically correct markup.

  5. cableghost
    Member
    Posted 2 years ago #

    Okay, say for a moment I go with blockquote, however, I want to use it inline; could someone provide me the css to allow blockquote to be inline and if possible, auto-add the curly q's around the text?

  6. esmi
    Theme Diva & Forum Moderator
    Posted 2 years ago #

    Inline? But it's inside a block level element (<p></p>). Why not use <blockquote<p>this would be the quoted text</p></blockquote> which would be the correct markup?

  7. cableghost
    Member
    Posted 2 years ago #

    For example, see the below. If I use a fair amount of quoting, the layout really looks garbled in blockquoting style, so I wish to elect using it inline.

    HP Looks Panicky as It Dumps Valuable Mobile, Consumer Product … eweek.com: In August 2011, HP announced they were going to drop their consumer-based products, and focus on enterprise client market. Something to think about for future budgets. "Aug 20, 2011 … News Analysis: The first question that comes to mind as HP abruptly changes direction is what were they thinking? The second question has…"

    Is there a way to use blockquotes inline??

  8. esmi
    Theme Diva & Forum Moderator
    Posted 2 years ago #

    Which part are you referencing? The whole quote? Or just the italics?

  9. cableghost
    Member
    Posted 2 years ago #

    Just the italics

  10. esmi
    Theme Diva & Forum Moderator
    Posted 2 years ago #

    OK - so in that context <q?</q> would be correct. But why use a shortcode when that would involve more typing than the correct HTML tags?

  11. cableghost
    Member
    Posted 2 years ago #

    As initially mentioned...

    As far as why creating a shortcode...I can had one simple button to TinyMCE, then I can highlight the text and click the respective button to add the <q> brackets.

  12. esmi
    Theme Diva & Forum Moderator
    Posted 2 years ago #

    It should be relatively easy to do using add_shortcode:

    function quote_func($content) {
         return '<q>' . $content . '</q>;
    }
    add_shortcode('quote', 'quote_func');

    http://codex.wordpress.org/Function_Reference/add_shortcode

  13. cableghost
    Member
    Posted 2 years ago #

    Thank you...couple things.

    There was a ' missing in your code...corrected code below.

    function quote_func($content) {
         return '<q>' . $content . '</q>';
    }
    add_shortcode('quote', 'quote_func');

    The function creates the shortcode, but when executed, it doesn't wrap the text, it creates another empty segment, as such...

    <p><q></p></p>

    I've tried to figure it out within the link you provided, but I can't. Any ideas?

  14. esmi
    Theme Diva & Forum Moderator
    Posted 2 years ago #

    You need to use [quote]blah...blah[/quote].

  15. cableghost
    Member
    Posted 2 years ago #

    That's how I use it, but it acts like there's no content, like so...

    [inline-quotes]Content here.[/inline-quotes]

    The result...

    ""
    Content here.

    PS. I changed 'quotes' to 'inline-quotes'

  16. esmi
    Theme Diva & Forum Moderator
    Posted 2 years ago #

    Try:

    function quote_func($atts, $content = null) {
         return '<q>' . $content . '</q>';
    }
    add_shortcode('inline-quotes', 'quote_func');
  17. cableghost
    Member
    Posted 2 years ago #

    Yeah, much better, however, <p> should still wrap around the quoted text.

    Using the example above again...

    [inline-quotes]Content here.[/inline-quotes]

    The page source result...

    <q>Content here.</q>
    <p>next paragraph</p>

    It should result in...

    <p><q>Content here.</q></p>
    <p>next paragraph</p>

  18. So

    function quote_func($atts, $content = null) {
         return '<q><p>' . $content . '</p></q>';
    }
    add_shortcode('inline-quotes', 'quote_func');

    Except NOW you're not able to do it 'inline' anymore, per your example. You can't do `This is me. [inline-quote]This is Bob[/inline-quote] This is me again.' Which was your example.

  19. esmi
    Theme Diva & Forum Moderator
    Posted 2 years ago #

    Shouldn't that be:

    function quote_func($atts, $content = null) {
         return '<p><q>' . $content . '</q></p>';
    }
    add_shortcode('inline-quotes', 'quote_func');

    Except NOW you're not able to do it 'inline' anymore, per your example.

    Agreed - 'cos now you've introduced a block-level element. If this is for your clients, then they're going to have to learn to use 2 buttons/shortcodes - 1 for inline quotes and 1 for block quotes. And the latter is identical to <blockquote></blockquote> - which means that we've come full circle.

  20. Er right, p then q.

    And the full circle thing too :)

  21. cableghost
    Member
    Posted 2 years ago #

    Okay, I should have tested the previous code on my example above, however, I just tried wrapping it around the complete paragraph for testing. So, I went back and just added it to the partial content to be in quotes, and the previous code worked. It wrapped the to-be quoted content in <q>, and the entire paragraph in <p>.

    For inline, assuming partial of a paragraph, the following code works:

    function quote_func($atts, $content = null) {
         return '<q>' . $content . '</q>';
    }
    add_shortcode('inline-quotes', 'quote_func');

    One last thing...when I apply the shortcode via button, it only produces one [inline-quotes]; the end, [/inline-quotes], is not produced. I notice there is </q> added to the code above, but it does not seem to be functioning.

    Thanks for the help.

  22. cableghost
    Member
    Posted 2 years ago #

    I actually found a better solution, thanks to input and threads found on stackexchange and stackoverflow.

    #1 Install TinyMCE plugin

    #2 Create shortcode(s), if needed: wordpress-shortcode-tutorial-simple-to-advanced-part-1

    #3 Add Functions.php code: how-do-i-add-a-tinymce-row-that-all-users-can-see-instead-of-just-admins

    #4 Create JS file: #5 of wordpress-shortcode-tinymce-button-tutorial-part-2

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags

No tags yet.