I am building blogging application. and i use summernote for write a blog content.
Blog content are stored in database like this :
<b>hi</b>.....<b>share if you like</b>
But when i fetch and try to disply blog content it will display same html code
ex:
<b>hi</b>.....<b>share if you like</b> insted of hi ..... share if you like.
Now how to display blog content with all styles?
Snap of table:
Snap of html output:
You can use dangerouslySetInnerHTML to render html content.
<div dangerouslySetInnerHTML={{__html: "<p>your html content</p>"}}></div>
Related
I am working on Blog Appliction in MERN an I have used CKEditor to enter the description in CKeditor from admin panel the data of CKEditor is storing in HTML tags and currently i am using
dangerouslySetInnerHTML to ignore the tags of html and show the data in just tag but i want to show the data with the exact tags as it was enter by CKEditor
For example
like if Admin add the unorder list or orderlist it should be disply on frontend but currently it is just showing ther data on new line without bulets
what showing now
Heading
A
B
C
D
What is was expecting
Heading
A
B
C
D
I have set up a Gatsby blog that uses md files to create pages for each blog post. I want to use Narrative.so (photo layouts) for the content of each blog. Using their software, it generates HTML for you to paste into your site's page.
Would this be possible in Gatsby?
Here is the HTML it gave me as an example:
<div class='nar-root' data-post-id='9ab2885d-f0e8-4d00-9c59-135ab04fc384' style='p {text-align:center;opacity: 0.0;animation: nara 0s ease-in 2s forwards;}#keyframes nara {to {opacity: 1.0;}}' >
<img style="width:100%;" src="https://content1.getnarrativeapp.com/static/9ab2885d-f0e8-4d00-9c59-135ab04fc384/featured.jpg">
<noscript><p>Your Narrative blog will appear here, click preview to see it live.<br>For any issues click here</p></noscript>
<script type="text/javascript" src="https://service.getnarrativeapp.com/core/embed/r/9ab2885d-f0e8-4d00-9c59-135ab04fc384.js"></script>
</div>
Yes, it is possible. Here is one possiblity:
Add MDX support to your blog
With MDX you can embed React components into your markdown file.
// markdown file
import { NarrativePhotoLayout } from '../components/NarrativePhotoLayout'
# Here’s a NarrativePhotoLayout
The NarrativePhotoLayout is rendered inside our MDX document.
<NarrativePhotoLayout/>
Build a React component that contains your HTML. This answer tells you how.
Embed your React component in your blog post.
Here's the background:
I want to be able to save rich text blog posts to Firebase to then display them, including code snippets, on a Posts page.
Right now, I'm simply saving a single string of html to Firebase, retrieving that per post, and setting it with dangerouslySetInnerHtml. I'm the only one adding posts.
However, this means that I lose tabbing information when displaying code snippets in blocks. I don't think I can use solution since I'm using dangerouslySetInnerHtml: Formatting code with <pre> tag in React and JSX
Any tips on how to store, retrieve, and display rich text using React and Firebase? Thank you for your help.
I was able to use the following to convert rich text to html, and then minify it:
https://4html.net/Online-HTML-Editor-Text-to-HTML-Converter-870.html
http://minifycode.com/html-minifier/
I'm trying to edit an email template that has (HTML with letterhead) type, and I want to add a button withing the template, but it won't recognize any HTML tags, it takes them as a plain text, does it really accept HTML tags or not? Thanks!
It does not support HTML Tags, the HTML with letterhead types are all wyswig editors so any HTML entered directly will be stripped.
If you want to send a custom template using pure HTML you need to use the HTML type or Visualforce type
See the documentation here https://help.salesforce.com/articleView?id=admin_emailtemplates.htm&type=0
I've managed to build a page that will display data from the database dynamically. However, this code which is saved in the database:
<p>This is the content for the radio page.</p>
Displays like this:
<p>This is the content for the radio page.</p>
The HTML tags aren't rendered. I understand that Symfony (for security purposes) renders any HTML code like this for security reasons. I want Symfony (obviously) to render these HTML tags. How can I achieve this just for this purpose only, so that Symfony still sanitises any HTML tag that is saved to the database elsewhere on the site?
For your information as well, this is the code that I am using to pull the data from the database:
public function mainpageAction($slug)
{
$content = $this->getDoctrine()
->getRepository('SiteMainBundle:Content')
->find($slug);
if (!$content) {
throw $this->createNotFoundException('No product found for slug '.$slug);
}
return $this->render('SiteMainBundle:Default:page.html.twig', array('content' => $content, 'slug' => $slug));
}
Also, just so I can learn more about Symfony, is the rendering of the HTML tags just the sole job of PHP or could it be rendered properly using Twig?
Many thanks!
If you want to do that, you need to use the raw filter in the twig template. Like described in the twig documentation, the raw filter marks the value as safe which means that in an environment with automatic escaping enabled this variable will not be escaped if raw is the last filter applied to it.
In your case, it's : {{ content | raw }}