Help with Rmarkdown HTML Logo

classic Classic list List threaded Threaded
2 messages Options
Reply | Threaded
Open this post in threaded view
|

Help with Rmarkdown HTML Logo

Bill Poling
Hello.

#RStudio Version 1.1.456
sessionInfo()
#R version 3.5.3 (2019-03-11)
#Platform: x86_64-w64-mingw32/x64 (64-bit)
#Running under: Windows >= 8 x64 (build 9200)

I feel I have made great progress teaching myself RMarkdown using HTML reporting for the moment.

However, one formatting item eludes me, the Logo.

It works fine as positioned in the script below, however, it does not travel with the HTML when I distribute it.

I understand why, because it resides in the same file as the report.

Looking at various urls for this topic I find that this appears to do the trick:

https://stackoverflow.com/questions/43009788/insert-a-logo-in-upper-right-corner-of-r-markdown-html-document

My problem is how does my file path work in this example please?

#MY File Path:
C:\WHP\Revenue Development Products\BRA AutoDistribution\ Zelis.jpg


---
title: AUTO DISTRIBUTION ANALYSIS
author: DRAFT FOR DISCUSSION
date:
output:
  html_document:
  params:
    interactive: TRUE
---
<script>
   $(document).ready(function() {
     $head = $('#header');
     $head.prepend('<img src=\"Zelis.jpg\" style=\"float: left;width: 150px;\"/>')
   });
</script>

<style type="text/css">
h1.title {
  font-size: 38px;
  color: Purple;
  text-align: center;
}
h4.author { /* Header 4 - and the author and data headers use this too  */
    font-size: 18px;
  font-family: "Times New Roman", Times, serif;
  color: Purple;
  text-align: center;
</style>


Everything above is fine, I want to enhance this report by making the logo a traveler so to speak.
Of course once I get this to work below I will remove the reference to it above.


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

<!---
#https://stackoverflow.com/questions/43009788/insert-a-logo-in-upper-right-corner-of-r-markdown-html-document
#http://freerangestats.info/blog/2017/09/09/rmarkdown
--->

Thank you for your assistance.

WHP




Confidentiality Notice This message is sent from Zelis. ...{{dropped:13}}

______________________________________________
[hidden email] mailing list -- To UNSUBSCRIBE and more, see
https://stat.ethz.ch/mailman/listinfo/r-help
PLEASE do read the posting guide http://www.R-project.org/posting-guide.html
and provide commented, minimal, self-contained, reproducible code.
Reply | Threaded
Open this post in threaded view
|

Re: Help with Rmarkdown HTML Logo

Bill Poling
I got it to work. Yay Me!

```{r, echo=FALSE}
htmltools::img(src = knitr::image_uri(file.path("C:/WHP/Revenue Development Products/BRA AutoDistribution/Zelis.jpg")),
               alt = 'logo',
               style = 'position:absolute; top:0; left:0; padding:10px;')
```
WHP


-----Original Message-----
From: Bill Poling
Sent: Monday, April 22, 2019 10:37 AM
To: r-help ([hidden email]) <[hidden email]>
Cc: Bill Poling <[hidden email]>
Subject: Help with Rmarkdown HTML Logo

Hello.

#RStudio Version 1.1.456
sessionInfo()
#R version 3.5.3 (2019-03-11)
#Platform: x86_64-w64-mingw32/x64 (64-bit) #Running under: Windows >= 8 x64 (build 9200)

I feel I have made great progress teaching myself RMarkdown using HTML reporting for the moment.

However, one formatting item eludes me, the Logo.

It works fine as positioned in the script below, however, it does not travel with the HTML when I distribute it.

I understand why, because it resides in the same file as the report.

Looking at various urls for this topic I find that this appears to do the trick:

https://stackoverflow.com/questions/43009788/insert-a-logo-in-upper-right-corner-of-r-markdown-html-document

My problem is how does my file path work in this example please?

#MY File Path:
C:\WHP\Revenue Development Products\BRA AutoDistribution\ Zelis.jpg


---
title: AUTO DISTRIBUTION ANALYSIS
author: DRAFT FOR DISCUSSION
date:
output:
  html_document:
  params:
    interactive: TRUE
---
<script>
   $(document).ready(function() {
     $head = $('#header');
     $head.prepend('<img src=\"Zelis.jpg\" style=\"float: left;width: 150px;\"/>')
   });
</script>

<style type="text/css">
h1.title {
  font-size: 38px;
  color: Purple;
  text-align: center;
}
h4.author { /* Header 4 - and the author and data headers use this too  */
    font-size: 18px;
  font-family: "Times New Roman", Times, serif;
  color: Purple;
  text-align: center;
</style>


Everything above is fine, I want to enhance this report by making the logo a traveler so to speak.
Of course once I get this to work below I will remove the reference to it above.


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

<!---
#https://stackoverflow.com/questions/43009788/insert-a-logo-in-upper-right-corner-of-r-markdown-html-document
#http://freerangestats.info/blog/2017/09/09/rmarkdown
--->

Thank you for your assistance.

WHP




Confidentiality Notice This message is sent from Zelis. ...{{dropped:13}}

______________________________________________
[hidden email] mailing list -- To UNSUBSCRIBE and more, see
https://stat.ethz.ch/mailman/listinfo/r-help
PLEASE do read the posting guide http://www.R-project.org/posting-guide.html
and provide commented, minimal, self-contained, reproducible code.