Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

WordPress WordPress for Website Owners Owning a WordPress Site Long Term Setting and Meeting Goals

Todd Squitieri
Todd Squitieri
8,001 Points
Posted by Todd Squitieri
Todd Squitieri
8,001 Points

Making a Resume an Adjustable Image??

I am presently attempting to transfer all of my website content to Wordpress, and am having some difficulty with adequately transferring my resume content to the new Wordpress Theme that I am using. More specifically, I am having text alignment issues.

I recently spoke to someone with more Wordpress experience than I, and he recommended that I turn my resume into a PDF or PNG image and then paste it into the page that i want to use for my resume section.

I tried doing this, but the resolution on the image was very poor, even when saving the file as SVG.

So, I am wondering if anyone has any ideas as to how I can go about inserting my resume--which is originally a DOC file--into a WordPress theme without compromising the format.

Any information/recommendations would be much appreciated!

Thanks so much,

Todd

2 Answers

Zac Gordon
STAFF
Zac Gordon
Treehouse Guest Teacher
Zac Gordon
Zac Gordon
Treehouse Guest Teacher

Putting up your resume as an image is definitely a bad idea since it isn't readable to computers. I would make a web version and display it as actual text on the page and then have a pdf people can download if they want.

Todd Squitieri
Todd Squitieri
8,001 Points
Todd Squitieri
Todd Squitieri
8,001 Points

Hi Zac,

Thanks for the reply! I tried making a web version with the theme that I'm using, but the indentation is all screwy; the text just won't justify properly. Is this a theme issue? A Wordpress issue?

The only other option I can think of doing is to just nix the whole public resume thing altogether and just post a link to a PDF version. Still...

Any further suggestions would be warmly appreciated.

Thanks so much!

-Todd

David Bilson
David Bilson
13,819 Points
David Bilson
David Bilson
13,819 Points

It might be a little beyond the scope of this course but you could override the default css styling on a page by page basis.

If you inspect the page with your browser development tools you will see that an id and several css classes are applied to the body tag within the html.

Lets take the Wordpress Showcase page as an example.

https://wordpress.org/showcase/

If you view the source of the page you will find that an id and several css classes are applied to the body tag of the page. You can use the page id to alter the CSS styles applied to that individual page.

i.e

<body id="wordpress-org" class="home page page-id-1708 page-template page-template-page-home page-template-page-home-php">

You can then use the class for the page id, in this case page-id-1708 to style the individual css for the page and / or override styles you do not want.

In the example below I have placed the CSS class selector within an inline style tag. This is so that the syntax highlighting shows for my reply. You would be editing an external stylesheet and therefore should omit this. The CSS styles I have added would override the current page background color and change it to red.

<style type="text/css"> <!-- OMIT THIS LINE -->

.page-id-1708 { background-color : red; }

</style> <!-- OMIT THIS LINE -->

So the steps to style your resume would be.

  1. Find id of the page.
  2. Create a class within your CSS for this individual page.
  3. Inspect elements on the page that you want to alter, to find what CSS styles are already applied.
  4. Override the css with your own styles.

If you need further information I suggest you search Treehouse for CSS courses and developer tool courses.