I'm working on nodejs & mongodb.
When I place this code; <%- postContent %>, it renders into the following format:
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praesent libero. Sed cursus ante dapibus diam. Sed nisi. Nulla quis sem at nibh elementum imperdiet. Duis sagittis ipsum. Praesent mauris. Fusce nec tellus sed augue semper porta. Mauris massa. Vestibulum lacinia arcu eget nulla. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.</p>
<img title="Image Title" class="alignnone wp-image-9453 size-full" src="https://example.com/images/2017/03/image-name-1.jpg" alt="image alt here" width="847" height="507" srcset="https://example.com/images/2017/03/image-name-1.jpg 847w, https://example.com/images/2017/03/image-name-1-300x180.jpg 300w, https://example.com/images/2017/03/image-name-1-768x460.jpg 768w, https://example.com/images/2017/03/image-name-1-825x493.jpg 825w, https://example.com/images/2017/03/image-name-1-410x246.jpg 410w, https://example.com/images/2017/03/image-name-1-150x90.jpg 150w" sizes="(max-width: 847px) 100vw, 847px">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praesent libero. Sed cursus ante dapibus diam. Sed nisi. Nulla quis sem at nibh elementum imperdiet. Duis sagittis ipsum. Praesent mauris. Fusce nec tellus sed augue semper porta. Mauris massa. Vestibulum lacinia arcu eget nulla. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.</p>
Now, my query is; how to I convert <img> into <amp-img>?
There is no way to convert. You have to replace the img elements with amp-img elements.
And you have to use amp-img attributes src and layout, width and height with respect to layout.
Related
Im developing a script in awk to convert a tex document into html, according to my preferences.
#!/bin/awk -f
BEGIN {
FS="\n";
print "<html><body>"
}
# Function to print a row with one argument to handle either a 'th' tag or 'td' tag
function printRow(tag) {
for(i=1; i<=NF; i++) print "<"tag">"$i"</"tag">";
}
NR>1 {
[conditions]
printRow("p")
}
END {
print "</body></html>"
}
Its in a very young stage of development, as seen.
\documentclass[a4paper, 11pt, titlepage]{article}
\usepackage{fancyhdr}
\usepackage{graphicx}
\usepackage{imakeidx}
[...]
\begin{document}
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla placerat lectus sit amet augue facilisis, eget viverra sem pellentesque. Nulla vehicula metus risus, vel condimentum nunc dignissim eget. Vivamus quis sagittis tellus, eget ullamcorper libero. Nulla vitae fringilla nunc. Vivamus id suscipit mi. Phasellus porta lacinia dolor, at congue eros rhoncus vitae. Donec vel condimentum sapien. Curabitur est massa, finibus vel iaculis id, dignissim nec nisl. Sed non justo orci. Morbi quis orci efficitur sem porttitor pulvinar. Duis consectetur rhoncus posuere. Duis cursus neque semper lectus fermentum rhoncus.
\end{document}
What I want, is that the script only interprets the lines that are between \begin{document} and \end{document}, since before they are imports of libraries, variables, etc; which at the moment do not interest me.
How do I make it so that it only processes the text within that pattern?
GNU AWK has feature called Range when you provide two conditions sheared by , then action will be applied only between lines with these conditions (including these lines), consider following simple example, let file.txt content be
junk
\begin{document}
desired text
more desired text
\end{document}
more junk
then
awk '$0=="\\begin{document}",$0=="\\end{document}"{print}' file.txt
gives output
\begin{document}
desired text
more desired text
\end{document}
(tested in gawk 4.2.1)
Use a regex to set a flag and then print based on that flag:
awk '/^\\begin{document}/{flag=1}
flag
/^\\end{document}/{flag=0}' file
That print everything between the start and ending strings inclusive:
\begin{document}
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla placerat lectus sit amet augue facilisis, eget viverra sem pellentesque. Nulla vehicula metus risus, vel condimentum nunc dignissim eget. Vivamus quis sagittis tellus, eget ullamcorper libero. Nulla vitae fringilla nunc. Vivamus id suscipit mi. Phasellus porta lacinia dolor, at congue eros rhoncus vitae. Donec vel condimentum sapien. Curabitur est massa, finibus vel iaculis id, dignissim nec nisl. Sed non justo orci. Morbi quis orci efficitur sem porttitor pulvinar. Duis consectetur rhoncus posuere. Duis cursus neque semper lectus fermentum rhoncus.
\end{document}
If you only want the text between and not including the start and end strings:
awk '
/^\\begin{document}/{flag=1; next}
/^\\end{document}/{flag=0}
flag' file
Prints:
# leading blank line printed...
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla placerat lectus sit amet augue facilisis, eget viverra sem pellentesque. Nulla vehicula metus risus, vel condimentum nunc dignissim eget. Vivamus quis sagittis tellus, eget ullamcorper libero. Nulla vitae fringilla nunc. Vivamus id suscipit mi. Phasellus porta lacinia dolor, at congue eros rhoncus vitae. Donec vel condimentum sapien. Curabitur est massa, finibus vel iaculis id, dignissim nec nisl. Sed non justo orci. Morbi quis orci efficitur sem porttitor pulvinar. Duis consectetur rhoncus posuere. Duis cursus neque semper lectus fermentum rhoncus.
# ending blank line printed...
I am trying to make the text floating around the image and have done my research and found out this question has asked before, however, I did tried their code and still doesn't work. I have pasted my code down below and can anyone have a look and give me some suggestions. Is the grid system stop the text wrapper around image as it divided them into two separate sections. How can I make the text floating around the image like the photo.
<div class="container text-section">
<div class="row">
<div class='float-left col-md-4'>
<img src="./assets/img/img6.jpeg" alt="img" width='100%'>
</div>
<div class='col-md-8'>
<p>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor.
Aenean massa.
Cum sociis
natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis,
ultricies nec,
pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo,
fringilla vel,
aliquet nec,
vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam
dictum felis
eu pede
mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean
vulputate eleifend
tellus.
Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam lorem ante,
dapibus in,
viverra quis, Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula
eget dolor.
Aenean massa.
Cum sociis
natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis,
ultricies nec,
pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo,
fringilla vel,
aliquet nec,
feugiat a, tellus. Phasellus viverra nulla ut metus varius laoreet.
</p>
</div>
</div>
</div>
When using rows and cols you wont get any floating as the columns always set a width.
Get rid of the cols and bring the image and the text together like this (i inserted a dummy image so you can actually see stuff):
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" rel="stylesheet"/>
<div class="container text-section">
<div class="float-left">
<img src="https://dummyimage.com/300x200" alt="img">
</div>
<p>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor.
Aenean massa.
Cum sociis
natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis,
ultricies nec,
pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo,
fringilla vel,
aliquet nec,
vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam
dictum felis
eu pede
mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean
vulputate eleifend
tellus.
Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam lorem ante,
dapibus in,
viverra quis, Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula
eget dolor.
Aenean massa.
Cum sociis
natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis,
ultricies nec,
pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo,
fringilla vel,
aliquet nec,
feugiat a, tellus. Phasellus viverra nulla ut metus varius laoreet.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor.
Aenean massa.
Cum sociis
natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis,
</p>
</div>
I am trying to get an image to pull-right and display block when in mobile, but my image keeps cutting into my text. Can anybody help me figure out how to make the image appear on top, then the text?
Here is the link: http://o-pd.com/AP
<div class="clearfix">
<img src="http://o-pd.com/AP/img/John-Abraham.jpg" alt="John Abraham" class="pull-right img-responsive gap-left" width="200" height="200">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean lacinia pharetra lacus, id pulvinar ligula molestie et. Duis in ultricies ipsum. Etiam tellus diam, eleifend in rutrum ac, facilisis quis dolor. Nulla ex elit, malesuada vel commodo ac, volutpat nec odio. Duis ac turpis dignissim, placerat lectus quis, venenatis dui.</p>
<br/><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean lacinia pharetra lacus, id pulvinar ligula molestie et. Duis in ultricies ipsum. Etiam tellus diam, eleifend in rutrum ac, facilisis quis dolor. Nulla ex elit, malesuada vel commodo ac, volutpat nec odio. Duis ac turpis dignissim, placerat lectus quis, venenatis dui.</p>
</div>
/*we will use media query to change the direction of img*/
#media (max-width:500px){
.pull-right{
float:left !important;
}
p{
clear:both;
}
}
I'm trying to create a new yahoo pipe that will only returned a slimmed down version of an xml.
Say my original XML looks like:
<?xml version="1.0" encoding="UTF-8" ?>
<name>Joe bloggs</name>
<age>31</age>
<description>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse aliquam metus id eros blandit vel convallis nunc accumsan. Fusce adipiscing eros a enim feugiat vestibulum. Cras vulputate malesuada neque vel ultricies. Nunc commodo condimentum risus, eu interdum odio rutrum ut. Nullam nec neque eget dolor tristique dignissim sit amet non nibh. Donec sagittis, elit eget tempus laoreet, tellus eros gravida nunc, eu elementum sem turpis eget velit. In hac habitasse platea dictumst. Donec sed nibh nec arcu feugiat malesuada nec sollicitudin neque. Morbi egestas gravida blandit. Praesent luctus ipsum sed sem porta a tempus ipsum congue. Cras non lectus metus. Fusce non purus quam, vel convallis urna. Aenean dignissim consequat tincidunt. Nunc posuere pulvinar est, id pretium sem vestibulum non</description>.
I'm trying to create a yahoo pipe that will change the tag names, in which I'm using the rename module, and it works fine.
Now, I'm wanting to get rid of the description tag, so my XML only returns name and age.
How can I do that with yahoo pipes?
Cheers in advance for any help
Use the Regex module on the description field and replace .* with an empty textfield. That deletes the field.
Use the "Create RSS" module as the last step in the chain. Then only include the fields you want.
I am using ASP.net MULTIVIEW control, but when I enter text in one of it's VIEW the text got expanded beyond specified width i.e. 200px in Visual Studio. What I want is to wrap the text within container. Here is the code. You can simply paste it in Visual Studio to see the problem.
<div style="width: 200px">
<asp:MultiView ID="MultiView1" runat="server" ActiveViewIndex="0">
<asp:View ID="View1" runat="server">
<p>
In ipsum risus, luctus eu lobortis eu, ultricies nec diam. Pellentesque non pharetra
odio. Etiam nisi felis, sagittis sit amet tempor sit amet, lacinia et mauris. Sed
id dui nisl, vitae pellentesque sapien. Sed justo elit, mattis a ornare egestas,
congue id tortor. Donec pharetra est sit amet augue scelerisque ultrices. Sed ac
urna nulla. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere
cubilia Curae; Maecenas risus quam, adipiscing non euismod ut, luctus ac magna.
Curabitur id nulla at magna vehicula scelerisque ac gravida ipsum. Integer non tellus
tortor.
</p>
</asp:View>
<asp:View ID="View2" runat="server">
some text here
</asp:View>
</asp:MultiView>
</div>