Reader view printing



  • Is there a way to change the font size in reader view such that it doesn't take take so many pages when I print to paper?
    I'm not a techie, so I may have missed something, but printing was so nice in clean pages in Opera. Thanks.


  • Vivaldi Translator

    @ChrisSZ
    Not from GUI Vivaldi, at least not yet.
    If not mistaken there's request for it.

    So, it's by editing Reader_View.js.
    That file reside in Vivaldi installation directory, rather deep in resources folder.
    No need to afraid it's a JavaScript, we just need to edit in CSS format.

    1. Close any running Vivaldi.
    2. Make a backup copy that file before editing.

    Sample from that file:
    I hope it make sense.

    /* global Readability */
    ...
    ...
    
    const readabilityCss = `
    .entry-content p {
      margin: 1.5em 0 1.5em 0;
    }
    
    h1 {
      font-size: 2em;
      line-height: 1.2;
    }
    
    h1, h2, h3, h4, h5, h6, b {
      font-weight: 700;
    }
    
    body {
      max-width: 700px;
      font-family: Helvetica, Arial, sans-serif;
      font-weight: 400;
      font-style: normal;
      font-size: 1.3em;   // You could change this. This effect main content (body). I could suggest to change it to common 10pt ~ 12pt. But, up to you.
      line-height: 1.5;
      margin: 0 auto;
      background-color: #f8f8f8;
    }
    
    img {
      max-width: 680px;
    }
    
    code, pre {
      background-color: #fff;
      padding: 0.3em 0.4em;
      text-align: left;
      font-weight: 300;
    }
    
    iframe, textarea, input {
      display: none;
    }
    `;
    
    ...
    ...
    


  • @dLeon

    Your solution and step by step instruction worked beautifully. Thanks so much! Regards, Chris.



  • This is great. Because of this post, I discovered Vivaldi's reader view. I like how it works.

    OK, one question. When I make the "2 em" for font-size smaller, can I use decimals--or do I have to content myself with only 1 or 2, whole numbers? I'd rather ask here, than goof up my js file. Yes, I did make a backup, but stil....


  • Vivaldi Translator

    @paulri
    Yes, the original was decimal isn't it? 1.3em. 1em is normal size.
    You also could use points (pt) like my example above.
    Or, pixel (px) even percent (%).

    More in depth info:
    https://www.w3schools.com/Css/css_font.asp

    Don't use space. Write it "2em" or "2pt".



  • @paulri
    I'm not knowledgeable in CSS styling, but In my case I changed 1.3em which I believe is 15 pt to .8em which is 10 pt.
    Please correct this if this is not the case.


  • Vivaldi Translator

    @ChrisSZ
    Quoted from https://www.w3schools.com/Css/css_font.asp

    Set Font Size With Em
    To allow users to resize the text (in the browser menu), many developers use em instead of pixels.

    The em size unit is recommended by the W3C.

    1em is equal to the current font size. The default text size in browsers is 16px. So, the default size of 1em is 16px.

    The size can be calculated from pixels to em using this formula: pixels/16=em

    So, 1em will be different if user set default to other than fresh install setting.



  • Got it. I struggled for a bit, because there are more than one font size given in that file. I at first was shrinking the h1, etc. font sizes, and wondered why the body text was not shrinking. All is well now.

    Saving a copy of the original js file made mistakes easy to come back from.

    Thanks again. This is great.



  • Print to a PDF printer driver, the print from your PDF Viewer, tiling multiple pages to a sheet.

    0_1490906712620_Print Multiple.png



  • @dLeon I’m having trouble finding Reader_View.js. Am I correct that the first step (on a Mac) would be to right-click on the Vivaldi icon and click “Show Package Contents”? If so, I can’t find that file anywhere in the resulting Contents folder (I tried searching the folder for “Reader” or “Reading,” but nothing came up). Did something get changed in 1.9?

    I’m asking because I’d like to change the reader view font, but there’s no way to edit the reader view settings in the app itself. If there is, at some point, it would be great if we had the ability to choose any font we wanted.

    Thanks!



  • @CHansen This isn't the mac forum, but here you go --

    applications/vivaldi.app/contents/versions/1.10.829.3/vivaldi framework.framework/resources/vivaldi/user_files

    Reader_View.js resides in this folder.



  • @luetage Thank you! Sorry, I didn’t see that this was the Windows forum.


Log in to reply
 

Looks like your connection to Vivaldi Forum was lost, please wait while we try to reconnect.