I want to use font awesome icon using #fontface rule. HOw can write styles inside in internal styles inside tag.
How can can I write the code?
Internal styles written inside head tag
#font-face {
font-family: "FontAwesomeRegular";
font-weight: normal;
font-style : normal;
src : url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.8.2/webfonts/fa-regular-400.ttf") format("truetype");
}
#font-face {
font-family: "FontAwesomeBrands";
font-weight: normal;
font-style : normal;
src : url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.8.2/webfonts/fa-brands-400.ttf") format("truetype");
}
#font-face {
font-family: "FontAwesomeSolid";
font-weight: bold;
font-style : normal;
src : url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.8.2/webfonts/fa-solid-900.ttf") format("truetype");
}
.fas{
font-weight: bold !important;
font-family: FontAwesomeSolid !important;
}
.fas::before{
font-weight: bold !important;
font-family: FontAwesomeSolid !important;
}
.fab{
font-weight: normal !important;
font-family: FontAwesomeBrands !important;
}
.fab::before{
font-weight: normal !important;
font-family: FontAwesomeBrands !important;
}
.far{
font-weight: normal !important;
font-family: FontAwesomeRegular !important;
}
.far::before{
font-weight: normal !important;
font-family: FontAwesomeRegular !important;
}
inside blade used <i class="fab fa-accessible-icon"></i>
Related
<div class="past-page"><?php previous_posts_link( '« Previous Page' ); ?></div>
Hello! I'm having a bit of troubles trying to solve the styling of a pagination button. I tried styling the past-page div, but that made a white box show up when no link was there... which was not the result I wanted.
So, I'm wondering if I can somehow add styling in the php tag here?
The style I want to add is
font-size: 10pt;
text-transform: uppercase;
font-weight: bold;
background: #fff;
padding: 10px;
use :not(:empty) to add style to a div that is 'not empty'; otherwise, when it is blank, it reverts back to the default CSS:
<style>
.past-page:not(:empty) {
font-size: 10pt;
text-transform: uppercase;
font-weight: bold;
background: #fff;
padding: 10px;
}
</style>
Alternatively, you could apply the style always unless empty then make it invisible:
<style>
.past-page {
font-size: 10pt;
text-transform: uppercase;
font-weight: bold;
background: #fff;
padding: 10px;
}
.past-page:empty {
display: none !important;
}
</style>
I am trying to use OLD English font in Dompdf with Laravel.,
I have inserted the font in laravel view. But it seems when generating the pdf It is not working.I tried editing dompdf >vendor >.../dompdf_font_family_cache.dist.php File.But no luck,
Can anyone Suggest a Solution?
Thanks In Advance.
Make a fonts directory in the storage folder of your Laravel project. ( storage/fonts )
Put your .otf or .ttf files in the storage/fonts directory.
In your view/html add #font-face rules by using the storage_path method Laravel provides.
#font-face {
font-family: 'Your custom font name';
src: url({{ storage_path('fonts\your-custom-font.ttf') }}) format("truetype");
font-weight: 400; // use the matching font-weight here ( 100, 200, 300, 400, etc).
font-style: normal; // use the matching font-style here
}
Add font-family rules to your css as seen below
body {
font-family: "Your custom font name";
}
Hope this helps.
I was trying to include custom fonts too.
I included the font in the view (using #font-face declaration), but when I tried to generate the pdf, it gave me an ErrorException in AdobeFontMetrics.php.
I resolved by creating a fonts folder in the storage folder of your laravel project.
So now I have:
> storage
> app
> fonts
> framework
> logs
I hope it will help
Set font into html page which is load in Dompdf
<html>
<head>
<style>
#font-face {
font-family: 'Helvetica';
font-weight: normal;
font-style: normal;
font-variant: normal;
src: url("font url");
}
body {
font-family: Helvetica, sans-serif;
}
</style>
</head>
<body>
<p>hello world</p>
</body>
</html>
#font-face {
font-family: 'Journal';
src: url('yourwebsite.com/journal.ttf")}}') format('truetype');
}
.typed {
font-family: 'Journal';
}
<p class='typed'>Signature</p>
Make sure to put your font name like this font: Journal; It will work.
Plus add fonts folder under your storage folder.
Place the font in the storage/fonts folder.
In my example OpenSans is used, you can download here https://files.fm/f/sr3wah265 . Unzip and put it in storage/fonts/
Open sans can also be downloaded from GoogleFonts.
then add the following style tag to your html.
<style>
#font-face {
font-family: 'Open Sans';
src: url({{ storage_path("fonts/static/OpenSans/OpenSans-Bold.ttf") }}) format("truetype");
font-weight: 700;
font-style: normal;
}
#font-face {
font-family: 'Open Sans';
src: url({{ storage_path("fonts/static/OpenSans/OpenSans-BoldItalic.ttf") }}) format("truetype");
font-weight: 700;
font-style: italic;
}
#font-face {
font-family: 'Open Sans';
src: url({{ storage_path("fonts/static/OpenSans/OpenSans-ExtraBold.ttf") }}) format("truetype");
font-weight: 800;
font-style: normal;
}
#font-face {
font-family: 'Open Sans';
src: url({{ storage_path("fonts/static/OpenSans/OpenSans-ExtraBoldItalic.ttf") }}) format("truetype");
font-weight: 800;
font-style: italic;
}
#font-face {
font-family: 'Open Sans';
src: url({{ storage_path("fonts/static/OpenSans/OpenSans-Light.ttf") }}) format("truetype");
font-weight: 300;
font-style: normal;
}
#font-face {
font-family: 'Open Sans';
src: url({{ storage_path("fonts/static/OpenSans/OpenSans-LightItalic.ttf") }}) format("truetype");
font-weight: 300;
font-style: italic;
}
#font-face {
font-family: 'Open Sans';
src: url({{ storage_path("fonts/static/OpenSans/OpenSans-Medium.ttf") }}) format("truetype");
font-weight: 500;
font-style: normal;
}
#font-face {
font-family: 'Open Sans';
src: url({{ storage_path("fonts/static/OpenSans/OpenSans-MediumItalic.ttf") }}) format("truetype");
font-weight: 500;
font-style: italic;
}
#font-face {
font-family: 'Open Sans';
src: url({{ storage_path("fonts/static/OpenSans/OpenSans-Regular.ttf") }}) format("truetype");
font-weight: 400;
font-style: normal;
}
#font-face {
font-family: 'Open Sans';
src: url({{ storage_path("fonts/static/OpenSans/OpenSans-SemiBold.ttf") }}) format("truetype");
font-weight: 600;
font-style: normal;
}
#font-face {
font-family: 'Open Sans';
src: url({{ storage_path("fonts/static/OpenSans/OpenSans-SemiBoldItalic.ttf") }}) format("truetype");
font-weight: 600;
font-style: italic;
}
#font-face {
font-family: 'Open Sans';
src: url({{ storage_path("fonts/static/OpenSans/OpenSans-Italic.ttf") }}) format("truetype");
font-weight: 400;
font-style: italic;
}
body {
font-family: 'Open Sans', sans-serif;
}
</style>
I have problem with custom font on my wordpress site, it works only on homepage but when you go on any subpages like http://domainname.com/about font stop work.
Kindly ask for some help.
Here is css which i use to pass fonts :
#font-face {
font-family: 'TrajanPro-Bold';
src: url("wp-content/fonts/TrajanPro-Bold.otf");
src: url("wp-content/fonts/TrajanPro-Bold.otf?#iefix") format('opentype');
font-weight: bold;
font-style: normal; }
#font-face {
font-family: 'AVENIRNEXT-BOLD';
src: url("wp-content/fonts/AVENIRNEXT-BOLD.OTF");
src: url("wp-content/fonts/AVENIRNEXT-BOLD.OTF?#iefix") format('opentype');
font-weight: bold;
font-style: normal; }
#font-face {
font-family: 'AVENIRNEXT-ITALIC';
src: url("wp-content/fonts/avit.otf");
src: url("wp-content/fonts/avit.otf?#iefix") format('opentype');
font-weight: normal;
font-style: italic; }
#font-face {
font-family: 'AVENIRNEXT-REGULAR';
src: url("wp-content/fonts/AVENIRNEXT-REGULAR.OTF");
src: url("wp-content/fonts/AVENIRNEXT-REGULAR.OTF?#iefix") format('opentype');
font-weight: normal;
font-style: normal; }
#font-face {
font-family: 'JaneAust';
src: url("fonts/JaneAust.ttf");
src: url("wp-content/fonts/JaneAust.ttf?#iefix") format('truetype');
font-weight: normal;
font-style: normal;
}
This is because the URL wp-content/fonts/TrajanPro-Bold.otf will be relative to the current page directory.
Make the path absolute by adding a leading slash / to all the URLs.
Example: /wp-content/fonts/TrajanPro-Bold.otf
I wrote the following SSCCE to demonstrate that I have a string (of some HTML), and I am using simple_html_dom parser to find out the div with a particular value of the class attribute. This works fine. But I need to remove this div from the parent string. So I am using str_replace, but it doesn't seem to work. Please tell me why and what is the solution.
I checked the solutions to questions addressing similar problems but they did not apply or work on my problem. I also tried to use str_replace_first from this question's answer by Bas. But it does not work either.
You can see in the screenshot that it just prints the entire $haystack after printing --------.
$haystack = '<div class="region-content" style="margin-right:100px; margin-left:100px;">
<div role="main"><span id="maincontent"></span><div class="que description informationitem notyetanswered" id="q6"><h4 class="accesshide">Question text</h4><input type="hidden" name="q3:6_:sequencecheck" value="1" /><div class="qtext"><p style="font-family: HelveticaNeueW01-55Roma, Helvetica, Arial, san-serif; margin: 0px 0px 20px; padding: 0px; color: #464646; font-size: 14.4444446563721px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 19.5px; orphans: auto; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: auto; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: #ffffff;">Schools expect textbooks to be a valuable source of information for students. My research suggests, however, that textbooks that address the place of Native Americans within the history of the United States distort history to suit a particular cultural value system. In some textbooks, for example, settlers are pictured as more humane, complex, skillful, and wise than Native Americans. In essence, textbooks stereotype and depreciate the numerous Native American cultures while reinforcing the attitude that the European conquest of the New World denotes the superiority of European cultures. Although textbooks evaluate Native American architecture, political systems, and homemaking, I contend that they do it from an ethnocentric, European perspective without recognizing that other perspectives are possible. </p>
<p style="font-family: HelveticaNeueW01-55Roma, Helvetica, Arial, san-serif; margin: 0px 0px 20px; padding: 0px; color: #464646; font-size: 14.4444446563721px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 19.5px; orphans: auto; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: auto; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: #ffffff;">One argument against my contention asserts that, by nature, textbooks are culturally biased and that I am simply underestimating children\'s ability to see through these biases. Some researchers even claim that by the time students are in high school, they know they cannot take textbooks literally. Yet substantial evidence exists to the contrary. Two researchers, for example, have conducted studies that suggest that children\'s attitudes about particular cultures are strongly influenced by the textbooks used in schools. Given this, an ongoing, careful review of how school textbooks depict Native Americans is certainly warranted.</p></div><div class="im-controls"><input type="hidden" name="q3:6_-seen" value="1" /></div></div>
<div class="que multichoice deferredfeedback notyetanswered" id="q7"><div class="qtext"><p><span style="color: #464646; font-family: HelveticaNeueW01-55Roma, Helvetica, Arial, san-serif; font-size: 14.4444446563721px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 19.5px; orphans: auto; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: auto; word-spacing: 0px; -webkit-text-stroke-width: 0px; display: inline !important; float: none; background-color: #ffffff;">Which of the following would most logically be the topic of the paragraph immediately following the passage?</span></p></div><div class="ablock"><div class="prompt">Select one:</div><div class="answer"><div class="r0"><input type="radio" name="q3:7_answer" value="0" id="q3:7_answer0" /><label for="q3:7_answer0">a. <span style="color: #464646; font-family: HelveticaNeueW01-55Roma, Helvetica, Arial, san-serif; font-size: 14.4444446563721px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 19.5px; orphans: auto; text-align: left; text-indent: 0px; text-transform: none; white-space: normal; widows: auto; word-spacing: 0px; -webkit-text-stroke-width: 0px; display: inline !important; float: none; background-color: #ffffff;">the contributions of European immigrants to the development of the United States</span></label> </div>
<div class="r1"><input type="radio" name="q3:7_answer" value="1" id="q3:7_answer1" /><label for="q3:7_answer1">b. <span style="color: #464646; font-family: HelveticaNeueW01-55Roma, Helvetica, Arial, san-serif; font-size: 14.4444446563721px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 19.5px; orphans: auto; text-align: left; text-indent: 0px; text-transform: none; white-space: normal; widows: auto; word-spacing: 0px; -webkit-text-stroke-width: 0px; display: inline !important; float: none; background-color: #ffffff;"><span class="Apple-converted-space"> </span>the centrality of the teacher\'s role in United States history courses</span></label> </div>
<div class="r0"><input type="radio" name="q3:7_answer" value="2" id="q3:7_answer2" /><label for="q3:7_answer2">c. <span style="color: #464646; font-family: HelveticaNeueW01-55Roma, Helvetica, Arial, san-serif; font-size: 14.4444446563721px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 19.5px; orphans: auto; text-align: left; text-indent: 0px; text-transform: none; white-space: normal; widows: auto; word-spacing: 0px; -webkit-text-stroke-width: 0px; display: inline !important; float: none; background-color: #ffffff;">nontraditional methods of teaching United States history</span></label> </div>
<div class="r1"><input type="radio" name="q3:7_answer" value="3" id="q3:7_answer3" /><label for="q3:7_answer3">d. <span style="color: #464646; font-family: HelveticaNeueW01-55Roma, Helvetica, Arial, san-serif; font-size: 14.4444446563721px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 19.5px; orphans: auto; text-align: left; text-indent: 0px; text-transform: none; white-space: normal; widows: auto; word-spacing: 0px; -webkit-text-stroke-width: 0px; display: inline !important; float: none; background-color: #ffffff;">specific ways to evaluate the biases of United States history textbooks <br /></span></label> </div>
<div class="r0"><input type="radio" name="q3:7_answer" value="4" id="q3:7_answer4" /><label for="q3:7_answer4">e. <span style="color: #464646; font-family: HelveticaNeueW01-55Roma, Helvetica, Arial, san-serif; font-size: 14.4444446563721px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 19.5px; orphans: auto; text-align: left; text-indent: 0px; text-transform: none; white-space: normal; widows: auto; word-spacing: 0px; -webkit-text-stroke-width: 0px; display: inline !important; float: none; background-color: #ffffff;">ways in which parents influence children\'s political attitudes <br /></span></label> </div>
</div></div></div>';
require('C:/xampp/htdocs/simple_html_dom.php');
$html = str_get_html($haystack);
foreach($html->find('div[class=que description informationitem notyetanswered]') as $h) {
$reading_passage_outertext = $h->outertext;
}
$hay = str_replace($reading_passage_outertext, "", $haystack);
echo $reading_passage_outertext;
echo '---------------------------------------------------------------------------------------------------------------';
echo $hay;
I guess outertext is returning an interpretation of parsed html. So it probably removes excess spaces, and may jumble the order of attributes. In other words you're getting a different string out than what str_get_html took in. You may want to just remove the div using the parser instead of str_replace
What I can see on your example is, that
$hay = str_replace($reading_passage_outertext, "", $haystack);
echo $reading_passage_outertext;
is outside of the foreach.
So $reading_passage_outertext only contains the last entry and str_replace does not really work.
I'm also not realy shure why you run through the str_get_html.
It doesn't make sense and costs quite some performance.
str_replace also accepts arrays as pattern and replacement values.
Try using str_replace only.
I have used CKEDITOR for saving some text in mysql database, it is saved in format like I have shown below
<p style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0); font-family: Arial, Helvetica, sans-serif; font-size: 12px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; orphans: auto; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: auto; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255);">
<span style="font-size: 14px;"><span style="font-family: arial, helvetica, sans-serif;">Buy 2 Buffet and Get 1 Free (Mon-Wed-Thu-Fri-Sat-Sun)</span></span><br />
<span style="font-size: 14px;"><span style="font-family: arial, helvetica, sans-serif;">Lunch buffet-</span></span><span style="font-size: 14px;"><span style="font-family: arial, helvetica, sans-serif;"><strong>Rs.399</strong><br />
Dinner Buffet-</span></span><strong><span style="font-family: arial, helvetica, sans-serif; font-size: 14px;">Rs.499</span></strong></p>
<p style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0); font-family: Arial, Helvetica, sans-serif; font-size: 12px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; orphans: auto; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: auto; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255);">
For Displaying it I have used php code like
echo htmlspecialchars_decode(stripslashes($main_row['meta_value']))
But it is showing output like
<p style="margin: 0px; padding: 0px; border: 0px; color: rgb(0, 0, 0); font-family: Arial, Helvetica, sans-serif; font-size: 12px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal;
line-height: normal; orphans: auto; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: auto; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255);">
<span style="font-size: 14px;"><span style="font-family: arial, helvetica, sans-serif;">Buy 2 Buffet and Get 1 Free (Mon-Wed-Thu-Fri-Sat-Sun)</span></span><br /> <span style="font-size: 14px;"><span style="font-family: arial, helvetica, sans-serif;">Lunch buffet-</span></span><span style="font-size: 14px;"><span style="font-family: arial, helvetica, sans-serif;"><strong>Rs.399</strong><br /> Dinner Buffet-</span></span>
I want to display this data as text, please help me out.
Just try to use
echo htmlspecialchars_decode($text);
And it will work .
try this:
echo htmlspecialchars_decode($main_row['meta_value'])
and let me know what is the result..
Use html_entity_decode it should work!
For example, assuming your text is stored in a variable called $text $text = html_entity_decode($text);