wpDiscuz - WordPress Comment Plugin
Inline commenting b...
 
Share:
Notifications
Clear all

Inline commenting breaks paragraphs. Use span instead div.

5 Posts
2 Users
1 Likes
1,471 Views
Posts: 4
Topic starter
(@mibal)
Active Member
Joined: 1 year ago

Hello.

At first, thank you for great plugin.

After short using i noticed that in the inline commenting the inserted div breaks the paragraph tags. You can't have div tag in paragraph tag and WordPress put every line break into paragraph. It will break the paragraph and leave it blank, which causes the issues when you for example want to inline comment certain words and not the whole sentence.

So my solution is, instead of div, use span. I changed for test the code in class.WpdiscuzCore.php and changed the divs to spans. Everything works like a charm, on desktop and mobile as well. It solved my issue on my project. See the image attachment.

wpdiscuz

Of course i do not recommend to change core files, but my project will run for certain time, so no update will be needed.

Consider to change the divs to spans in next updates for solve the line breaks issues in paragraphs πŸ™‚

Line between 2219 - 2254

    public function feedbackShortcode($atts, $content = "") {
        global $post;
        if ($this->isWpdiscuzLoaded && comments_open($post->ID) && apply_filters("wpdiscuz_enable_feedback_shortcode_button", true) && $this->form->isUserCanSeeComments(WpdiscuzHelper::getCurrentUser(), $post->ID)) {
            $atts = shortcode_atts([
                "id" => "",
                "question" => "",
                "opened" => 0
                    ], $atts, self::WPDISCUZ_FEEDBACK_SHORTCODE);
            if ($atts["id"] && $atts["question"] && ($inline_form = $this->dbManager->getFeedbackFormByUid($post->ID, $atts["id"]))) {
                $content = "<span class='wpd-inline-shortcode wpd-inline-" . ($inline_form->opened && $this->form->isUserCanComment(WpdiscuzHelper::getCurrentUser(), $post->ID) ? "opened" : "closed") . "' id='wpd-inline-" . $inline_form->id . "'>" . html_entity_decode($content);
                $content .= "<span class='wpd-inline-icon-wrapper'>";
                $content .= "<svg class='wpd-inline-icon" . ($this->options->inline["inlineFeedbackAttractionType"] === "blink" ? " wpd-ignored" : "") . "' xmlns='https://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'><path class='wpd-inline-icon-first' d='M20 2H4c-1.1 0-1.99.9-1.99 2L2 22l4-4h14c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm-2 12H6v-2h12v2zm0-3H6V9h12v2zm0-3H6V6h12v2z'/><path class='wpd-inline-icon-second' d='M0 0h24v24H0z' /></svg>";
                $args = [
                    "count" => true,
                    "meta_query" => [
                        [
                            "key" => self::META_KEY_FEEDBACK_FORM_ID,
                            "value" => $inline_form->id,
                            "compare" => "=",
                        ],
                    ],
                ];
                $count = get_comments($args);
                $content .= "<span class='wpd-inline-icon-count" . esc_attr($count ? " wpd-has-comments" : "") . "'>" . esc_html($count) . "</span>";
                $content .= "<span class='wpd-inline-form-wrapper'>";
                $content .= "<span class='wpd-inline-form-question' style='display: block;'>" . esc_html($inline_form->question);
                $content .= "<span class='wpd-inline-form-close'><a href='#'>x</a></span>";
                $content .= "</span>";
                $content .= "</span>";
                $content .= "</span>";
                $content .= "</span>";
            }
        }

        return $content;
    }
4 Replies
Asti
Posts: 6742
 Asti
Support
(@asti)
Illustrious Member
Joined: 6 years ago

Hi Mibal,

As you've noticed, the text which is selected for feedback is being wrapped in a <div> so other parts are separated and inserted in <p> paragraphs. This is designed to use a whole paragraph.

So, please don't use a few words in a sentence for feedback. You should use a text part that can be introduced as a separate paragraph.

Reply
Posts: 4
Topic starter
(@mibal)
Active Member
Joined: 1 year ago

Hello,

in my project it will be discussed more words in one sentence, which i think is to be expected.

Anyway, when i use the whole sentence, it throws out the text from paragraph and then left the paragraph blank because it can't be div in paragraph. As you can see in your demo as well. And it causes also a design issue because you have bigger padding under the h3 title (because of blank paragraph).

Screen Shot 2022 10 24 at 12.46.15 PM

So my improvement with span i think is better, it do not throw out the text from paragraph, because span can be in paragraph, no design issues with blank paragraphs, you can comment words in sentence and works on desktop and mobile as well.

Maybe will be enough just after adding the div, completely remove the blank paragraphs and div will behave as paragraph πŸ™‚

Reply
1 Reply
Asti
 Asti
Support
(@asti)
Joined: 6 years ago

Illustrious Member
Posts: 6742

@mibal,

Please read Tom's answer here: https://wpdiscuz.com/community/postid/15107/

Reply
Posts: 4
Topic starter
(@mibal)
Active Member
Joined: 1 year ago

Thanks, i read that before i created this topic. I pick one line from Tom's answer "So there is no way to keep a text before shortcode in the same line."

Yes there is a way, i wrote my solution here (Tom's answer not solved my issue). I am OK with it, if you decide to not to change your code, but my quick fix can help to somebody else, if will look for help with the same issue as me πŸ™‚

Thank for great plugin although πŸ™‚

Reply
Share: