I have a div which have dynamic background based on user-input, so I want to load the background directly from erb file so when I type
<div class="desk" style="background:url(myphoto.png);">
It doesn't work, although it work if I typed this line into css file
so any suggestions what's going on here?
Path is wrong it should be prefixed with "/assets/". You should use asset_path method. Without that additional problems will occur on production when md5 hash will be added at the end of filename. Try this:
<div class="desk" style="background:url(<%= asset_path('myphoto.png') %>);">
More information about that can be found in Rails Guides
Related
I am using VSCode's Prettier extension and trying to work on some html for a Salesforce Lightning Web Component. In my html, I have a div like so
<div class={someVar}</div>
This is the correct syntax for this, however, whenever I save Prettier adds quotes like this
<div class="{someVar}"
which causes a syntax error. I can't seem to find this setting anywhere in the prettier settings or anything online about how to disable this addition.
I have some other html files that this doesn't happen to when I save, just this new html file I just added.
I started to work with mautic (open source email marketing automation).
Im trying to build a template for a landing page and therefore I'm editing "*.html.twig" files. At least I could find out that twig is a PHP engine by Symfony. What I could not find out yet though is something actually totally simple, at least in css/html.
All I want to do is specify the correct file path to an image file as a background-image:url(''); within the style attribute of the body tag. (See example below)
How on earth is this twig working with file paths? It seems to automatically change the file path I specify, but in a way that is not comprehensible to me.
I tried several options, but the only thing that works at least partially is specifying the absolute path. As soon as I start using the template in mautic though and build a page from it and save it, even the absolute file-path gets 'crashed' on the output source code. What the heck?
I did not find much info on file path syntax in twig. What I found sounded so horribly complicated that I can't believe it should really be that complicated to simply put in a file path? Am I wrong?
Here is the example, specifying the absolute path in the actual source code.
<body style="background-image:url('http://sawiya.de/mautic/themes/mautictheme1/img/background.jpg'); background-color:#213E4C;">
When viewing the result in the browser, without adding content to the landing page template, the source code output is the following (path changed, but the result is at least that the image is being shown):
background-image:url(http://1.1.1.2/bmi/1.1.1.5/bmi/sawiya.de/mautic/themes/mautictheme1/img/background.jpg);
After adding content on top of the template in mautic, the file path is being changed even more and reads the following from the source code output (now the background image does not get displayed anymore, so its clearly broken):
background-image: url(http://1.1.1.3/bmi/sawiya.de/mautic/"http://1.1.1.5/bmi/sawiya.de/mautic/themes/mautictheme1/img/background.jpg")
What is this all about? Where can I get the info on how to easily and correctly specify the file path? Is it really that hard?
Ok, now I found out something strange. It might be a bug in mautic here.
When I open the page where I specified the image via the background-image:url() through the https:// -Protocol, instead of http://, it works!
And the resulting source code looks as expected:
background-image: url("http://1.1.1.5/bmi/sawiya.de/mautic/themes/mautictheme1/img/background.jpg")
So, wrong adress here, I think. At least to solve the bug. Hope someone finds this as a solution, until the bug is fixed.
Cheers!
Edit: Of course its better to specify the file path in a relative way, so that when the theme is used on another server, the path is still correct. In twig the best way to do that seems to be this. At least it works perfectly well.
background-image: url('{{ getAssetUrl('themes/'~template~'/img/logo.png', null, null, true) }}';)
I am using Symfony2 with twig to generate HTML, however the HTML I am generating is not intended for a web browser, instead it will be passed to a library that converts HTML to a PDF document.
There are two related issues I am facing.
Issue 1. This PDF will have images included, I don't want these images to be visible directly from the internet (e.g. I don’t want these images to appear under webroot). Usually I put assets in “site/src/path-to-bundle/Resources/public/assets” however, I don't want this image to be visible on the web. Can anyone suggest a good folder to put “assets” in that are not meant to be accessible via the web. (Just trying to be consistent with Symfony2 naming techniques and how other programmers would usually do this)
Issue 2. Since the HTML I am generating is intended for the HTML to PDF generator, it is most practical to refer to images with absolute paths on the file system (web paths or URLs are not suitable in this situation).
For example
<!-- This is the correct HTML code that is needed in this situation -->
<img src="/home/user/absoulte-file-system-path-to/image.png" />
<!-- These are actually incorrect in this situation -->
<img src="assets/image.png" />
<img src="http://www.somedomain.com/assets/image.png" />
I would like to know how to get the absolute path to the image mentioned above (I don’t mind if this is done in the Twig template or in the controller)
in you app/config/config.yml
twig:
globals:
root_path: %kernel.root_dir%
and you can refer to asset with relative path to your root project
<img src="{{ root_path }}/../secret-folder/image.png" />
I have just recently implemented the five star rating system from ajax, into my asp.net site. Everything works fine in locall debug mode.However. Once i publish it, the css does not show up. I have declared all of the css within the content page, not sure if this is why. I am very in-experienced with working with css; so i am sorry if it something simple.
I have checked the spelling of the image url, and have also tried implementing it into the site.css. But as i said, i am in-experienced; so am not sure what to do here.
This is my code as it stands:
The css declared at the top of the content page:
http://codepad.org/m1w39Hep
The reference to the css from my rating control:
http://codepad.org/Kl0BKets
Thanks in advance!
Check if your css links is right and your css files loaded successfully
I have seen your code.
Give extention as ".css" and not ".c"
I dont think that you can use Codepad for that because it does not give support for CSS.
If you are not using Codepad
Then as you are deploying it in server then check the URLs of the Images that are present in the CSS file for rating/.
I started to use DOMPDF in my CodeIgniter project to render some information in PDF.
Everything is OK when I display the information in html. But... no images were displayed in PDF, for the same HTML code (info: images used for background).
Except images, the other CSS info were correctly displayed (color, text-indent,...).
I tried the same 'kind' of code without using CodeIgniter, and the images were generated correctly.
Conclusion: Problem using DOMPDF in CodeIgniter.
Some ideas? I tried many 'random' combinations, but it still doesn't work. No google results for keywords 'CodeIgniter, DOMPDF, CSS, Images'...
Thanks in advance.
After more testing, I was able to add images:
By writing the CSS inside the HTML code, using tag.
Use paths relative to the root directory, not the HTML file, like: ./assets/img/my_image.png
This worked for me, but I don't know why.