[Resolved] How Can we Make this in a Post

Home Forums Support [Resolved] How Can we Make this in a Post

Home Forums Support How Can we Make this in a Post

Viewing 14 posts - 1 through 14 (of 14 total)
  • Author
    Posts
  • #1607767
    Sourabh

    Hi,

    Refer image snap and a URL in the private section and guide how to make this section within a post ??

    Regds:

    #1607865
    David
    Staff
    Customer Support

    Hi there,

    you would add the HTML to your post using a HTML Widget.
    You won’t require these two lines:

    <!DOCTYPE html>
    <!-- Created By CodingNepal -->

    The CSS you can add to a Hook Element > wp_head and set the Display Rules to the places you want it applied.
    The CSS has to be wrapped in these tags:

    <style>
    /* Add the CSS here */
    </style>
    #1608360
    Sourabh

    OKay i will try and update you..

    #1608377
    David
    Staff
    Customer Support

    You’re welcome

    #1608457
    Sourabh

    Hi David, Seems I am making some mistake, refer the steps I am following –

    Hook Created – WP_head – CSS with style tag – Display rules set to blog.

    Now inserting HTML widget and pasting HTML code, however when I see a preview – then I see Code executing and getting code output, however, it’s an article so want to share code, etc so don’t need execution for myself.

    I also don’t get any border around code etc, and code copy buttons, etc…overall guide me again and correct my steps.

    refer preview url in P-Section.

    #1608511
    David
    Staff
    Customer Support

    If you simply want to display the code in the article, then use a Code Block, any code you paste within will be formatted for users to copy.

    #1608905
    Sourabh

    Okay.. and where should I find this code block ?

    #1608916
    Elvin
    Staff
    Customer Support

    Hi,

    Okay.. and where should I find this code block ?

    Code block is one of Gutenberg Editor’s core blocks.
    https://share.getcloudapp.com/nOuD2QOE

    This article explains it briefly.
    https://www.pair.com/support/kb/gutenberg-editor-formatting-code-in-wordpress-posts/

    #1609107
    Sourabh

    No, I tested it in a sample post but it’s not looking as I am trying to achieve.

    Refer P-Section, how it’s looking (It’s merely adding a background, nothing else, no copy button, no border nothing).

    however, what I am trying to achieve is already shared in P-section.

    #1609178
    David
    Staff
    Customer Support

    The core code block doesn’t have a copy function. There are some plugins that add a button or theres this one which just makes the block copied on click:

    https://wordpress.org/plugins/code-click-to-copy/

    #1609393
    Sourabh

    Tried and getting the copy button too, not the look, anyways leave it then – just last question how that man has done this in his website ???

    #1609424
    David
    Staff
    Customer Support

    I don’t they may have custom coded that or used a plugin like this:
    https://wordpress.org/plugins/copy-the-code/

    #1609623
    Sourabh

    Okay, Ignore then, Thanks a ton for your efforts…

    #1609688
    David
    Staff
    Customer Support

    You’re welcome

Viewing 14 posts - 1 through 14 (of 14 total)
  • You must be logged in to reply to this topic.