WordPress.org

Ready to get started?Download WordPress

Forums

WP Post to PDF Enhanced
[resolved] Margins and hiding some text (22 posts)

  1. acekin
    Member
    Posted 5 months ago #

    Thank you for a functional PDF conversion from WP posts. I wonder if the following is possible:
    1. May I change the margins, especially the left and right margins? If so, how? I tried adding the following to the custom CSS field with no result:

    body {margin: 500px;}

    I know this is excessive margin, I just wanted to see if it would affect anything. It did not.

    2. Is it possible to exclude some text from printing in the PDF document? I added a short line at the bottom of the post to show how to produce a PDF copy but would prefer not to print it in PDF.

    Here is the page where I am testing WP Post to PDF:
    http://www.keptlight.com/orchis-is-coming-2/

    with a manual insertion of the icon at the bottom.

    It would be great if we could adjust the margins in the plugin interface. Ability to change the footer to add a copyright notice will be a definite plus.

    Thank you,

    Cemal

    https://wordpress.org/plugins/wp-post-to-pdf-enhanced/

  2. Lewis Rosenthal
    Member
    Plugin Author

    Posted 5 months ago #

    Hi, Cemal. Nice to meet you, and thanks for your kind words.

    The problem with adding something like margin control to the admin settings as that these are highly theme-specific (as you've actually discovered). The best approach is to use the CSS box, but you need to hit on the right settings.

    After looking at the age in question, and using Chris Pedrick's Web Developer Extension for Firefox, it looks like you might want to try something like:

    .site-inner, .wrap
    {
      margin-left: 180px;
      max-width: 960px;
    }

    The page seems to have the following for that (picked up from magazine-pro/style.css?ver=3.0, line 439, et seq.):

    .site-inner, .wrap
    {
      margin-top: 0pt;
      margin-right: auto;
      margin-bottom: 0pt;
      margin-left: auto;
      max-width: 1140px;
    }

    I recommend either Chris Pedrick's Firefox extension or Firebug for this sort of detective work.

    Give the above snippet a try. You might find it necessary to add !important to one or both of those lines; I didn't look closely enough to be sure.

    Please let us know how you make out!

    Cheers

    Lewis

  3. Lewis Rosenthal
    Member
    Plugin Author

    Posted 5 months ago #

    Oh, and to hide text, you would add a css class to it and give it the hidden attribute in the CSS box. Examples on the net abound, but here's one, and of course, there's always w3schools.com.

    Typo alert: You're missing the "t" in "Click the icon..." on that page. ;-)

    Cheers

  4. acekin
    Member
    Posted 5 months ago #

    Thank you for the quick reply and keen eyes that found the missing "t" which I planted there to see how carefully people look at my pages ;-)

    I do use FireBug extensively, but I cannot identify the elements you utilize in generating the output. Pouring text into a prescribed area would be easier to control than adjusting the source to become the destination, would it not? In any case, I will try your suggestions and also weak the CSS I use for printed output. Maybe that will control the PDF output.

    Thank you,

    Cemal

  5. acekin
    Member
    Posted 5 months ago #

    Well, fixing the missing "t" was easy, but the snippet you provided had no effect on the output with or without !important.

    Does your plugin honor css declared specifically for print output? If so, I will focus on that and tweak that part. Worth a shot.

    By the way, there is a missing "p" in "age"!

    Cemal

  6. acekin
    Member
    Posted 5 months ago #

    Not much luck!

    Did I see somewhere that one could use [donotprint] [/donotprint] to enclose the text or am I imagining things?

    I still think setting the margins and printable area in the control panel is a better solution from the user viewpoint. I have no idea how complex it may be to implement it.

    Thanks again,

    Cemal

  7. Lewis Rosenthal
    Member
    Plugin Author

    Posted 5 months ago #

    That is a shortcode from the wp-print plugin, Cemal, not this one. Thus, it has no effect. The only option we have to hide such text is currently via CSS, but you need to set an id in order for that to be effective.

    Meanwhile, your point about margins is well taken, and you've convinced me. If you care to try it, you may download the latest trunk build, which includes an expanded and somewhat reorganized admin UI, as well as the ability to set left, right, top, header, and footer margins. You may download the development version here (just scroll down that page).

    I'll look at implementing a text hiding shortcode, but there are some other pressing bits I really need to address before the next release, so no promises (or predictions) as to when that may be. ;-)

    Good luck!

    Lewis

  8. acekin
    Member
    Posted 5 months ago #

    Thank you Lewis. Adding a CSS ID is not a problem but it has to be specific to print. I put the text to instruct the visitor and do not want to hide it from the view but only from print just as the icon does not print.

    I will try the new release once I discover the location of the t"trunk" ;-)

    Cemal

  9. Lewis Rosenthal
    Member
    Plugin Author

    Posted 5 months ago #

    You're very welcome, Cemal; thanks for stating your case so clearly.

    As for hiding the text, you could try the print media css type, though it really should make little difference. Defining an element ID to the text you wish to style as hidden in the PDF and then referencing that element with the hidden attribute in the CSS box means that any time you add that ID to any post or page, it should be hidden in the PDF. It will not impact the web rendering of the content at all, as that CSS is only injected into the HTML rendered when converting to PDF.

    You don't need to locate the trunk; click on the link to download the Development version form the page I referenced above, and WordPress.org will zip the whole thing for you. Just download that zip, and then upload to your site, as you would when installing any other plugin locally.

    Cheers

    Lewis

  10. acekin
    Member
    Posted 5 months ago #

    Hello Lewis,

    I got a copy from:
    https://github.com/wp-plugins/wp-post-to-pdf-enhanced

    and installed it on a test site I maintain. I can see the new admin settings. However, when I first installed and activated the plugin it populated most of the text fields in the admin interface with some text. I have no idea where they came from but when you visit the page below you see them displayed before the content. I will leave them there until you see them in case they point you in a direction. When I disable WP-P2-PDF those lines on the page also disappear.

    Another thing to note is that although I chose the footer not to be filled, it comes out filled. I do not see any place where I could specify margins or text line width. It is possible that I downloaded the wrong ZIP file. Here is the test page (which may disappear without notice):
    http://www.testbed.biz/colorado-skiing/

    If you like to have admin access to this test bed site send me an e-mail at ac.ekin {at} hotmail.com. I will create an admin account and e-mail it back to you.

    Cemal

  11. acekin
    Member
    Posted 5 months ago #

    One more thing, I enclosed the text in a DIV with ID being hidethis. Then I added the following in the custom CSS box:

    #hidethis {display: none;}

    But as you will see, the PDF output still includes that line.

    Cemal

  12. Lewis Rosenthal
    Member
    Plugin Author

    Posted 5 months ago #

    If you don't download the plugin from where I have directed you, I'm sorry; I can't help.

    The version on github apparently syncs (well behind schedule) with WordPress, but as the current stable tag is 1.0.3, and the readme there shows 1.0.2, it is clear that it is not current. As for the trunk build there, I am certain that it predates the work I just did.

    Again, you may download the development version here. Scroll down that page to Other Versions, and under there, Development Version (svn).

    I'd prefer not to get involved with one-on-one troubleshooting at this point, simply because my time is quite limited right now, and this is more or less a hobby venture for me (I am a network consultant by day - and night).

    If you can find someone who is perhaps more skilled in CSS than I, he could help you identify the correct element to hide.

    Meanwhile, one thing at a time. Please download the current development (trunk) version and go from there.

    Cheers

    Lewis

  13. acekin
    Member
    Posted 5 months ago #

    I'm sorry, I did not see the link to where I should have downloaded the plugin so I searched. I will make another assumption that "trunk" refers to the plugins on WordPress.org. If I'm wrong, that's my problem. Thanks for your help, I understand how time consuming these could be. By the way, I used to teach Web design and CSS, I am reasonably comfortable with it.

    Cemal

  14. Lewis Rosenthal
    Member
    Plugin Author

    Posted 5 months ago #

    BTW, try:

    div#hidethis
    {
      display:none;
    }

    But be sure that the shortcode to display the icon is outside the <div>. ;-)

    (You got me; my back was hurting, so instead of getting up to move more patch cables around, I looked at your test site.)

    Cheers

    Lewis

  15. Lewis Rosenthal
    Member
    Plugin Author

    Posted 5 months ago #

    No apology necessary, Cemal (I should ahve refreshed the page before my last post; I missed yours in between).

    "Trunk" refers to the latest development version, "tags" are released versions, and "branches" are portions under different stages of development (I don't routinely commit - upload - my branches; they're internal).

    Cheers, and good luck!

    Lewis

  16. acekin
    Member
    Posted 5 months ago #

    When I annoy someone I assume responsibility, even if it was unintentional. By offering you to login to my test bed, I assumed I was helping you see a problem as it happened. But, never assume!

    I found the "trunk" version, installed it. To a large extent it works, with some points needing improvement. And I wrote a review to that end.

    Thank you for your help, I won't bug you again.

    Cemal

  17. Lewis Rosenthal
    Member
    Plugin Author

    Posted 5 months ago #

    Apologies for the late follow-up.

    Reviews should really be written toward the release version, and not the trunk version, as there is much to be done before releasing a trunk build (it's a work in progress).

    As you seem to be having some issues on your site getting that text to hide, I'll enter an enhancement request in my internal bug tracker to add the ability to specify a text string to the shortcode for the icon. That should automatically be hidden when we process the content, as we don't render our own shortcode content (the icon, presently).

    Cheers

    Lewis

  18. Lewis Rosenthal
    Member
    Plugin Author

    Posted 4 months ago #

    While working on a way to hide this text, I was indeed able to get the CSS method to work:

    HTML in post:

    <p class="wpptopdfenh">We can generate a PDF of this page by clicking the icon. [wpptopdfenh]</p>

    Custom CSS in plugin settings:

    p.wpptopdfenh {
      display:none;
    }

    Note this did not work for a div, and it does not work with !important, though it does work consistently as stated above.

    Test page for this is Sample Page here.

  19. acekin
    Member
    Posted 4 months ago #

    Thank you. Yes, it does work with this syntax. The class must be wpptopdfenh, other class names fail. The class name must be evaluated internally as relevant to WPP2PDF, or it may be hard-coded. So long as it works, I don't really care what the class name is ;-) Do you think what makes it work is the specificity of the declaration?

    Thank you,

    Cemal

  20. Lewis Rosenthal
    Member
    Plugin Author

    Posted 4 months ago #

    Hi, Cemal...

    You're welcome.

    The class must be wpptopdfenh, other class names fail. The class name must be evaluated internally as relevant to WPP2PDF, or it may be hard-coded.

    Not quite. I think the issue is that this (the custom CSS for the PDF) may be overridden by CSS which has already been applied. For example, I just named the class "hideme" and adjusted the CSS in the plugin settings to:

    p.hideme {
      display:none;
    }

    and this worked fine. However, I could see where re-using an existing class this setting may not take precedence, and where even the !important directive might not work. Still, I think this CSS approach is probably the best one to address your enhancement request vs adding yet another shortcode to (hopefully) achieve the same result. In this case, as long as the site admin decides upon a unique name for this class, the hiding should work consistently. I'm a little bothered by the need to set this in a paragraph tag, and also, it might make more sense to make it more specific (i.e., use an ID instead of a class). So, the following works as well:

    <p>This last paragraph contains a disappearing sentence. <span id="hideme">We can generate a PDF of this page by clicking the icon. [wpptopdfenh]</span></p>

    using this custom CSS in the plugin settings:

    span#hideme {
      display:none;
    }

    Now, we're no longer slaved to hiding an entire paragraph, so the link/icon and descriptive text may even occur within a paragraph, like so:

    <p>This last paragraph contains a disappearing sentence. <span id="hideme">We can generate a PDF of this page by clicking the icon. [wpptopdfenh] </span>This is the last sentence in the closing paragraph, and should be visible in the PDF.</p>

    The same test page referenced above now has this content. The granularity of the ID coupled with using a span tag should keep us safe from conflicts in the rest of the content and allow webmasters to use whichever ID they might prefer.

    Cheers

    Lewis

  21. acekin
    Member
    Posted 4 months ago #

    Thanks Lewis for further explanations. I will try it with the ID and SPAN. One example of my implementation is at:
    http://www.keptlight.com/orchis-is-coming-2/

    I have even put a custom footer with a copyright notice. Thank you for your hard work. Very useful plugin, getting better with each iteration and usage guides.

    Cemal

  22. Lewis Rosenthal
    Member
    Plugin Author

    Posted 4 months ago #

    Excellent, Cemal. I see that you've made good use of the custom footer, and the hiding of the text referencing the PDF works well. Thanks for your kind words and great feedback, too.

    Now, default-style page numbering should get this polished off. So, I guess I should include options for left/right & top/bottom positioning, as well as above/below the custom footer? Did I leave anything out except for scheme (#/#, page # of #, #, etc.)?

    Thanks

    Lewis

Reply

You must log in to post.

About this Plugin

About this Topic