Insert Logo top right corner of HTML or PDF.

[luisferlante]

Hi there,

After doing some research on how to do this, I've come across a Stackflow post with this exact subject, the most up-voted answer seemed straight forward.

Stackoverflow - Logo

---
title: "Title"
author: "Author"
output: html_document
---


```{r, echo=FALSE}
htmltools::img(src = knitr::image_uri(file.path(R.home("doc"), "html", "insert_my_logo_here.png")), 
               alt = 'logo', 
               style = 'position:absolute; top:0; right:0; padding:10px;')

The post mentions that all needed is to have the logo image is on the same directory as the project and the above code beneath the YAML.

Any feedback or assistance is great appreciated.
Best regards,
LF

[luisferlante]

Anyone could assist on why this isn't working?

The logo Insert_my_logo_here.png is located inside the project folder and I get an error stating:

Line 10 Error in if (fileSize <= 0) {: missing value where TRUE/ FALSE needed Calls: < Anonymous >... < Anonymous > -> < Anonymous > -> tag < Anonymous > ->

Below is my header, the rest of my code works fine and I'm able to compile / knit to a html file. My logo is called LFC_logo.jpg and is located in the project folder.

---
title: "Title"
author: "Author"
date: '`r format(Sys.time(), "%d %B, %Y")`'
output: html_document


---
```{r, echo=FALSE}
htmltools::img(src = knitr::image_uri(file.path(R.home("doc"), "html", "LFC_logo.jpg")), 
               alt = 'logo', 
               style = 'position:absolute; top:0; right:0; padding:10px;')

The original stackflow doesn't have more information which lead me to believe it was supposed to be a straight forward thing.

Thank you for you time and assistance.
LF.

[jdb]

The code file.path(R.home("doc"), "html", "logo.png") was used in the example because it will always point to the R logo that comes when you install R on your computer. To make it work for your case, you need to have the file path to the image within your project, which will be different.

[luisferlante]

Hi and thank you for your assistance!

Unfortunately I did make the necessary changes to the code to the below and continue to get the same error.

---
title: "Title"
author: "Author"
date: '`r format(Sys.time(), "%d %B, %Y")`'
output: html_document
---

```{r, echo=FALSE}
htmltools::img(src = knitr::image_uri(file.path(getwd(), "html", "my_logo_name.png")), 
               alt = 'logo', 
               style = 'position:absolute; top:0; right:0; padding:10px;')

Same error as before, even after adusting the file path to the projects. I also tried instead of getwd() , writing the full file path: "C:/Users/name/project_folder"

Line 10 Error in if (fileSize <= 0) {: missing value where TRUE/ FALSE needed Calls: < Anonymous >... < Anonymous > -> < Anonymous > -> tag < Anonymous > ->

[jdb]

Is the full file path to your image C:/Users/name/project_folder/html/ LFC_logo.jpg?

I get the same error as you do if I point knitr::image_uri to an invalid file path.

[luisferlante]

@jdb thanks for your time and assistance, seriously!!

I was able to now understand the syntax of what the code was supposed to do, it needed the full file path.

htmltools::img(src = knitr::image_uri("C:/Users/my_name/Dropbox/R-Projects/LFC_logo.png"), 
               alt = 'logo', 
               style = 'position:absolute; top:0; right:0; padding:10px;'),
              

The issue with the above is that the logo is huge and overlaying the rest of the report, is there a way to adjust the size for the above code?

I also found the alternative, but for the below I don't know how to adjust the position. The size of the logo is perfect but it is placed below the YAML header, I would like it to be at the top right corner "in" the YAML header...

---
title: "Title"
author: "Author"
date: '`r format(Sys.time(), "%d %B, %Y")`'
output: html_document

---

```{r, out.width = "400px", echo=FALSE} 

knitr::include_graphics("C:/Users/my_name/Dropbox/R-Projects/LFC_logo.png")

The goal is to have the logo at the top right corner, the 400px size is fine, I just need to figure how to adjust the position of the image.

Do I need to use different codes if the output changes? I currently output the report as html, but be requested to hand it in in pdf, from what I've been reading online the answer is yes...?

Once again, thank you for your time and assistance!

[jdb]

You can adjust the width and height of the image withing the style argument of htmltools::img, as is shown in your code.

htmltools::img(src = knitr::image_uri("C:/Users/my_name/Dropbox/R-Projects/LFC_logo.png"), 
               alt = 'logo', 
               style = 'position:absolute; top:0; right:0; padding:10px; width: 110px; height: 128px') # Added width and height as CSS