This site is a Ghost blog that is using Discourse for the Comments. What is Online Community?. Notice how nicely the comments is presented. Please what CSS is used for this? The comments on my own website are not good. They stretch the entire length of the screen. Ideally I want them to look Just like the one I posted. Here is my site https://ogatutor.com/

Is this what you are looking for? [This image is a screenshot of a computer system displaying several open windows and a text editor. (Captioned by AI)] this topic has information about how to format embedded posts: Styling your Embedded content If you are running Discourse 1.4.0 or greater, you have the ability to add a stylesheet for your embedded comments. Use the Embedded CSS section of the Theme editor at Admin > Customize > Themes > Edit CSS/HTML and you can add a custom stylesheet that will be served up with your embedded comments. By default we think the layout looks nice on a white background, but if your site has a unique layout you’ll want to style it yourself. [image] Embed Discourse comments on another website via Javascript Integrations Discourse has the ability to embed the comments from a topic in a remote site using a Javascript API that creates an IFRAME. For an example of this in action, check out Coding Horror’s blog. The blog is run via Ghost but the comments are embedded from his Discourse forum. One important thing to note with this setup is that users have to navigate to your forum to post replies. This is intentional, as we feel that the posting interface on a Discourse forum is currently much richer than what we …

You can just open Dev tools in your browser and inspect the elements to see the CSS This can also be achieved by simply right clicking on the element and selecting “inspect”. You may have to go up down the html hierarchy to see all the CSS.

Tried that, can’t find it there.

My blog is Ghost blog that is using Discourse for comments. The Comments are working ok, BUT the CSS is to make them blend in is what I am looking for. Look at the one I reffred to. Notice how the Comments flow nicely? Now look at ine. The comments Spran the entire length of the screen

Try Inspecting the comment on the Blog. In the Inspect window, you should see a tab called ‘Styles’ that has the CSS of the selected (and all) elements.

Thanks, Odd, same window not opening on my Safari, don’t know why. THANKS

THANK YOU !! That’s what I was looking for.

No CSS can be deployed without it being exposed in the browser dev tools. I suspect you need time to learn the tools :wink:

nice looking ghost site. but it looks like your ghost site embed is a bit broken or misconfigured. [Screenshot 2024-09-11 at 8.51.50 PM] [Screenshot 2024-09-11 at 8.49.40 PM] [Screenshot 2024-09-11 at 8.47.30 PM]

THANK you !! Yes, it is Broken, but I have followed ALL the instructions on how to embed but for some reason(s) it seems I I am not getting it right. Here is what my Embed looks like. [Screenshot 2024-09-12 at 11.47.16 AM] That configuration generates this code code. if (window.location.pathname.indexOf('/p/') < 0) { DiscourseEmbed = { discourseUrl: 'https:/teachmeai.ogatutor.com/‘, discourseEmbedUrl: '{{url absolute="true"}}' }; (function() { var d = document.createElement('script'); d.type = 'text/javascript'; d.async = true; d.src = DiscourseEmbed.discourseUrl + 'javascripts/embed.js'; (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(d); })(); } Note: I left the Path Allowedlist empty because, when I enter anything there, the code will not even run What could I be doing wrong? Thanks

What CSS was used for Comments here?

Product Support

NateDhaliwal (Nate Dhaliwal) September 11, 2024, 10:56pm 4

Hi there, what problem did you encounter?

Topic		Replies	Views
How to style embedded comments? Product Support	19	5326	June 2, 2019
404 not found when embedding comments Product Support	9	1025	August 27, 2020
Discourse + Ghost integration, console error Development	1	564	April 25, 2020
How to solve the Discourse comment not showing with Ghost for applying the official tutorial Self-hosting	0	397	February 20, 2022
How to customize appearance of discourse embeds? Product Support	4	1375	October 6, 2022

What CSS was used for Comments here?

Related topics