• Resolved amdark

    (@amdark)


    Hi, I’m loving the plugin, congratulations on the great job.
    I would like to insert images right after the question text, this is necessary for educational questions where there is a graphic or image that is part of the question. How could you proceed to insert the image right after the text and before the answers?

Viewing 8 replies - 16 through 23 (of 23 total)
  • Thread Starter amdark

    (@amdark)

    If it’s not too much trouble and you can explain it to me, I think it will work better in my case.

    Plugin Author Harmonic Design

    (@harmonic_design)

    STEP 1. Edit the plugin.

    From your admin area, goto plugins -> plugin editor. Select HD Quiz from the top right dropdown to being editing HD Quiz directly.

    Open up the includes folder, then select functions.php to begin editing this file.

    Now replace line 436$fields[$key]["value"] = wp_kses($v["value"], $allowed_html); with the following.

    $fields[$key]["value"] = wp_kses_post($v["value"]);

    Select the Update File button located underneath the editor to save.

    STEP 2
    We’ve now updated the plugin to allow just about any HTML in the question title field. This does not magically convert the field into a visual editor, but will allow us to add HTML to that field without it getting removed when you save.

    So edit/add a new question, and add the following HTML tag to wherever you want the image to be placed in the title.

    <img src = "####"/>

    Replace #### with the full URL of the image. A “quick” way to get the URL of an image is to use the “Question Featured Image” feature to upload an image (you don’t need to set the image as a featured image, we are just using this as a quick way to upload images). When you upload an image, the right sidebar of the popup uploader will contain a section called “Copy Link” – this is the URL of the image you uploaded.

    So a full example of a question would be:

    This is a question that <img src = "https://wordpress.com/images/image.jpg"/> has an image in the middle of it.

    This is what I meant when I said that it is possible to get the result you are looking for, it’s just not a very intuitive way of doing it 🙂

    Thread Starter amdark

    (@amdark)

    Unfortunately it didn’t work out very well, the image was broken, it follows an image of how I did the process:

    View post on imgur.com

    Plugin Author Harmonic Design

    (@harmonic_design)

    It looks like you did step 1 correct, so the issue must be step 2. That icon you see is an icon for an image tag that has an invalid source.
    Can you show me the full text that you put into your question?

    Thread Starter amdark

    (@amdark)

    (Cesgranrio) A substância cuja molécula está representada a seguir é responsável pelo aroma natural de canela. <img src="https://focanosestudos.com.br/wp-content/uploads/2020/05/Pretéritos-del-Indicativo-enem.jpg" /> A função orgânica a que pertence essa substância é:

    • This reply was modified 5 years, 12 months ago by amdark.
    Plugin Author Harmonic Design

    (@harmonic_design)

    Yup. The issue is that the image you added does not exist…

    Try going to the image directly: https://focanosestudos.com.br/wp-content/uploads/2020/05/Pretéritos-del-Indicativo-enem.jpg and you just get a 404 page not found error.

    If you change the src link https://focanosestudos.com.br/wp-content/uploads/2020/05/Pretéritos-del-Indicativo-enem.jpg to one of a real image it will work

    Thread Starter amdark

    (@amdark)

    very strange, I copied the image link again and pasted it and it worked now.

    Doubts would it be possible to increase the size of the text box for better visualization of the content when creating the question?

    How could you center the image inserted by html? I tried the tag center but it didn’t work

    Plugin Author Harmonic Design

    (@harmonic_design)

    This would depend on your theme, but adding the following CSS has a good chance of working.

    
    .hdq_question_heading img {
        display: block;
        margin: 0 auto;
    }
    
Viewing 8 replies - 16 through 23 (of 23 total)

The topic ‘Image below the question text’ is closed to new replies.