htmlcssrrpres

image and text side by side Rstudio presentation / .rpres


I'm trying to achieve the basic layout that 99% of presentations use where a slide has a title some text below that and then an image below that with text to its side. Apparently, this is a very difficult task to accomplish in rstudio presentations (the link here was no help). How do I go about doing it? Below is what I'm looking for (made in powerpoint):

enter image description here

Here's what I've tried thus far:

Title
====================================
incremental: false

<font color = "darkred">
 Additional Text Goes Here</font>

<div align="center">
<img src="fake.png">
</div>

***

<p>&nbsp;</p>
<p>&nbsp;</p>


- Text goes here
- Text goes here
- Text goes here

Which clearly produces a ridiculous outcome:

enter image description here

Problems with the current output:

Here's my attempt at addressing those issues:

Title
====================================
incremental: false

<p>&nbsp;</p>

<div style="margin-left: 1em;">
<font color = "darkred">
 Additional Text Goes Here</font>
</div>

<p>&nbsp;</p>


<div align="center">
<img src="fake.png">
</div>

***

<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>


- Text goes here
- Text goes here
- Text goes here

And I tried

<div style="padding: 10px;">
<font color = "darkred">
 Additional Text Goes Here</font>
</div>

Both of those did nothing, I tried messing around with the css and added the following:

<style>
p {
    text-indent: 240px;
}
</style>

Which produced the following:

enter image description here

But some major problems persist:

My knowledge of html and css is next to nothing so thanks for bearing with me. I simply in disbelief that the most basic feature of slide shows is some how missing from Rstudio's quintessential format of presentations (images with text above and adjacent) -clearly I must be missing something. Any help is much appreciated.

Oh and two final points -when I turn to the actual slide it appears exactly how I want it (if I've gotten rid of the spacing and css styles) for perhaps less than a second or 2 (while its rendering). Also, I thought I'd check Rpubs just to check my sanity -assuming there would be tones of projects with this layout on there. I went through maybe 30 different presentations and either 1) the presentation did not have a layout slide in the form I desire (2/3rds of them) and the remaining presentations that did have a layout all were suffering from the exact same problem I am. Every single presentation with a format like that look absolutely terrible like the images above. I guess the good folks at Rstudio are busier with more important tools than making Rstudio presentation format a reasonable choice of slideshow to use, which is absolutely fine. Unfortunately, slidify is a nightmare in developmental purgatory, beamer's templates are very arcane looking, and I cant find a single example of an ioslide project on the internet so I didn't even bother going down that rabbit hole. I'm open to suggestions of other presentations formats that can be used with R otherwise I'm stuck taking screenshots of my R output and code to to upload to a powerpoint (****cringe****). Thanks.


Solution

  • I seem to have found a "solution". In the examples I posted above I was examining the plots in Rstudio's Viewer as well as in my Safari browser. Both produced identical results but I decided to give it a go with Chrome and Firefox and they both produced the same nice looking format. I guess Rstudio presentation's formats are browser dependent -perhaps not surprising as I've seen different browsers recommended for different sites/uses but I did not see anything in regards to that documented on Rstudio's help forum.

    enter image description here

    UPDATE: I just double checked the documentation for Rstudio and it looks like they say chrome, firefox, ie, and safari are supported.

    enter image description here

    UPDATE 2: I just spotted another discrepancy between the browser outputs. When I go into full screen mode (using the key F) in Firefox everything is fine as expected and in Safari everything looks as it does in non-full screen. In Chrome fullscreen, however, the background color of the all the slides following the title slide are rendered black. This has been noted elsewhere too.

    enter image description here

    I'm baffled. I just have to prey that any subsequent obstacles I face aren't specific to firefox since I'm running low on browsers and I'll move to powerpoint before installing IE on my computer.