32 Replies Latest reply on Oct 25, 2016 12:00 PM by rob day

    how to best export from ID for build of Wordpress website?

    malch

      Hi there,

      I'm 'building' pages in InDesign that I'll be giving a fellow who will use Wordpress to build a website that I (an absolute non-coder) will be able to update.  I did check into Weebly and Wix and a couple of other do-it-youself website builders, but I need a design that their templates can't deliver, so I'm going with this guy who says he can create something using Wordpress that I'll then be able to update quite easily.

      I've got to find the best way, though (to make things easier for him, and to keep my costs low) to give him my files, for easy translation from ID to Wordpress.

      Is there a plug-in for this?

      Or anything else?

      Thanks in advance for any advice.

      Malcolm

        • 1. Re: how to best export from ID for build of Wordpress website?
          Derek Cross Level 6

          If you know InDesign you'll easily be able to create a simple website in Adobe Muse yourself.

          • 2. Re: how to best export from ID for build of Wordpress website?
            malch Level 1

            Thank you Derek for your reply. 

            My website (it's complicated, but suffice to say) is for restaurants, and will feature photos, ratings and reviews, and none of the other website builders allowed me to build a site the way I want to, but I hadn't even heard of Muse!  I will check it out now...

            Regards,

            Malcolm

            • 3. Re: how to best export from ID for build of Wordpress website?
              BobLevine MVP & Adobe Community Professional

              Just type it up in Word and hand off the text. If he knows what he’s doing, that’s all he’ll need.

              • 4. Re: how to best export from ID for build of Wordpress website?
                Derek Cross Level 6

                Isn't there a restaurant package you could buy?

                 

                In any case make sure your site is "responsive", that is, the pages will reflow to fit computers, tablets and smart phones.

                • 5. Re: how to best export from ID for build of Wordpress website?
                  malch Level 1

                  to Bob—here's the thing.  I typed up all my text in Word, but even the simple act of importing all those many (hundreds) of entries into InDesign wasn't easy.  It all imported, but I had to go back into each entry to fix the fonts.  Very time-consuming.  I was sort of thinking that going from Word to Wordpress would also have hiccups like this.

                  to Derek—not sure what a restaurant package is, but as mentioned, I looked at all the templates in Weebly and Wix and didn't see one for an restaurant review website.  Yes, though, the fellow who will be doing the customizing into Wordpress has said the site will definitely be 'responsive'.

                  I'm watching some Muse demos on the Adobe Muse website now... still haven't figured out if it would be something I could do or not.  I will do more searching around the site to see if I could demo Muse first.  I already belong to CC for InDesign and Photoshop, so maybe I could add Muse on a trial basis.

                  Anyway, thanks to both of you,

                  Malcolm

                  • 6. Re: how to best export from ID for build of Wordpress website?
                    John Mensinger Adobe Community Professional & MVP

                    malch wrote:

                    ...all my text in Word...

                    ...the simple act of importing all those many (hundreds) of entries into InDesign wasn't easy.

                    Very time-consuming.

                    I was sort of thinking that going from Word to Wordpress would also have hiccups like this.

                    Perhaps, but what made you think that InDesign to Wordpress would somehow be better? It might be worse.

                     

                    Styling text in Wordpress will be a necessary step regardless of how you style it beforehand, and your efforts to do so are 100% waste, regardless of the application in which it's done.

                     

                    Plain text is what your web guy needs. Giving him anything else will just make an extra step for him to clean out all the application-specific markup and arrive at...plain text.

                    • 7. Re: how to best export from ID for build of Wordpress website?
                      BobLevine MVP & Adobe Community Professional

                      I’m afraid that has nothing to do with providing content for a website. Take InDesign out of this equation; it is not the right tool for creating web content.

                      • 9. Re: how to best export from ID for build of Wordpress website?
                        rob day Adobe Community Professional & MVP

                        Yes, though, the fellow who will be doing the customizing into Wordpress has said the site will definitely be 'responsive'.

                        Wordpress is completely template driven and the design of the layout depends on the chosen WordPress theme and its CSS style sheets. Once the theme and styles are set by you or your designer there's virtually no design work that happens in the backend, the pages are all created on the fly from the Wordpress theme's PHP code and the associated CSS styles. Responsive sites conform to the user's screen, so in general designing static page layouts set to a specified dimension is a waste of time.

                         

                        It's more important to learn how to use and navigate the WordPress backend for page and post creation than an app like Muse or Dreamweaver. It would be useful to know some basic HTML for customizing text styling that is not included in the generic WordPress text processor, but it is not required.

                        • 10. Re: how to best export from ID for build of Wordpress website?
                          rob day Adobe Community Professional & MVP

                          Here's an example of the WP backend running the Expression portfolio theme with the backend on the left and the created portfolio page on the right in the browser. You can see there is no HTML or styling needed for page creation and the resulting portfolio page bears little resemblance to the backend view. The typography depends on the CSS stylesheet I created for the site and is not generally applied in the WP editor.

                           

                          Screen Shot 2016-10-24 at 3.17.13 PM.png

                          • 11. Re: how to best export from ID for build of Wordpress website?
                            malch Level 1

                            thank you everyone.  I now realize that whatever 'design' work that I do in InDesign will have to be re-done in Wordpress.  It's good that I know that, but nevertheless, I'm happy to be able to plan the look and feel of the website using InDesign because, at the very least, this will save me having to explain to the guy who ends up building it in Wordpress how I want it to look; if this guy just has to build what he sees (in my very complete InDesign examples) and not come up with a design, or at least, not have to try to interpret my written descriptions and instructions... I'm way ahead.

                            So... here are my options as I see them:

                            1.  pay this guy to re-create my 'InDesign web-design' in Wordpress (in which, by the way Rob, this guy says he can customize templates).  Then, because I'll be able to make changes to the site, I will spend the time adding content and fixing fonts and whatever else.  And once all that's done, I'll be able to 'update' the site myself, according to my web contact.

                            The advantage of this option is that once I pay this guy the one time, I won't have to pay him (or anyone) any more.  At least I think that's correct.

                            or

                            2.  download and use Muse to build my website.  Surely (I'm prepared, though, to hear Bob say this isn't the case) I'd be able to copy my InDesign files into Muse without losing all my design attributes?  If—but this is still a big 'if' for me—I can build my website using Muse, then clearly I'd be able to update it easily, on my own.  An advantage here is that I won't have to pay this fellow to build the site in WordPress; the disadvantage of option 2, though (I'm semi-retired and have to watch my money) is that I'm then stuck with paying for Muse and a yearly basis (at approx. $25 Cdn. a month!).

                             

                            I think from your first post, Rob, that you're suggesting Wordpress might be the better option for me, as long as I can learn "how to use and navigate the WordPress backend for page and post creation". 

                             

                            I appreciate all this advice...

                            Malcolm

                            • 12. Re: how to best export from ID for build of Wordpress website?
                              rob day Adobe Community Professional & MVP

                              pay this guy to re-create my 'InDesign web-design' in Wordpress (in which, by the way Rob, this guy says he can customize templates).  Then, because I'll be able to make changes to the site, I will spend the time adding content and fixing fonts and whatever else.

                              The ecosystem of Wordpress templates is so vast that building a new theme from scratch is the definition of reinventing the wheel. So what most developers do now is create a child theme from and existing theme. Child themes let you alter the site typography and geometry without reinventing the usually very complex javascript and PHP built into the theme.

                               

                              So a good start is to shop for a theme that fits the look you want and ask your developer to adjust the typography and color as needed.

                               

                              https://themeforest.net/category/wordpress

                              • 13. Re: how to best export from ID for build of Wordpress website?
                                rob day Adobe Community Professional & MVP

                                An advantage here is that I won't have to pay this fellow to build the site in WordPress; the disadvantage of option 2, though (I'm semi-retired and have to watch my money) is that I'm then stuck with paying for Muse and a yearly basis (at approx. $25 Cdn. a month!).

                                But then you won't have the content management system WP provides. It gets pretty difficult to maintain a site of any complexity without a CMS.

                                • 14. Re: how to best export from ID for build of Wordpress website?
                                  BarbBinder Adobe Community Professional

                                  He can do the site through WordPress, or you can design it yourself using Muse—which to clarify, has an InDesign look and feel but does not work with InDesign documents. What's nice about Muse is that it feels intuitive to an InDesign user.

                                   

                                  It really sounds to me like you need to decide if you want him to do the work, or if you want to try it yourself. In either case, I would not select InDesign for the mock-ups. Maybe Illustrator, maybe Photoshop, maybe a pen and a napkin. Once the site design is agreed upon, one of you gets to work on the layout (in WordPress or Muse) and you start writing up content and collecting the artwork to drop into the site created with either scenario.

                                  • 15. Re: how to best export from ID for build of Wordpress website?
                                    malch Level 1

                                    Hi again,

                                    I clearly don't understand a lot, but here's what my web-builder contact (who uses WordPress) told me:  "WordPress is amazing cause a programmer can create a website and then hand it over to someone who is not programmer to fill the content. The programmer wouldn't need to visit the website again unless it was to add a new functionality"

                                     

                                    If this is indeed the case then a WordPress-created site would represent a one-time cost to me.  Right?

                                    I will check out those themes you linked me to, Rob, but I would imagine my web guy (I've never even met him, but I'm calling him "my guy") uses whatever theme he can, to start with, and then customizes from there.

                                     

                                    Barb, thanks for clarifying about Muse looking and feeling like InDesign, but not working with InDesign documents.  That was too much to hope for I guess. 

                                    My decision may, in the end, come down to cost, that is, how the one-time cost of this WordPress web-guy compares to the monthly (or yearly) cost of Muse.

                                     

                                    Best Regards all,

                                    Malcolm

                                    • 16. Re: how to best export from ID for build of Wordpress website?
                                      rob day Adobe Community Professional & MVP

                                      He can do the site through WordPress, or you can design it yourself using Muse

                                      The advantage of WordPress is the content management system and the current themes all have responsiveness built in usually in a very sophisticated way, which I doubt could be replicated by a beginner with Dreamweaver or Muse. Also, Google penalizes sites that are not mobile friendly and responsive—a review site will need SEO.

                                      • 17. Re: how to best export from ID for build of Wordpress website?
                                        BarbBinder Adobe Community Professional

                                        One-time cost, for now. There will be updates, Malcolm. As humans, we see areas for improvement, plus technology evolves. You may well need him again down the road. I just had my site redesigned in WordPress by a web development team (it's a complex site) and that's part of why I am following this convo so closely. Muse wouldn't have worked for me because of the complexity. Muse might for you, but there are a lot of advantages to WordPress (see notes above), and to hiring a professional to handle the design while you focus on content.

                                         

                                        But in any case, back to Bob's very early answer: just type the text in Word, and cut and paste it. The web designer will handle the CSS for the fonts, and hopefully the training required to help you understand how to do it.

                                        • 18. Re: how to best export from ID for build of Wordpress website?
                                          BarbBinder Adobe Community Professional

                                          Muse sites are responsive and support SEO, but I'm on your side, Rob. WordPress, unless Malcolm wants to take it all on himself. Many people I know do, but not me!

                                          Create a responsive website with Adobe Muse | Adobe Muse CC tutorials

                                          Search engine optimization for Adobe Muse websites

                                          • 19. Re: how to best export from ID for build of Wordpress website?
                                            rob day Adobe Community Professional & MVP

                                            told me:  "WordPress is amazing cause a programmer can create a website and then hand it over to someone who is not programmer to fill the content. The programmer wouldn't need to visit the website again unless it was to add a new functionality"

                                             

                                            If this is indeed the case then a WordPress-created site would represent a one-time cost to me.  Right?

                                            I will check out those themes you linked me to, Rob, but I would imagine my web guy (I've never even met him, but I'm calling him "my guy") uses whatever theme he can, to start with, and then customizes from there.

                                             

                                            The cost of hosting the site would be ongoing, but that would be ture no matter how you develop. It is true that the Wordpress backend in general acts like a word processor, but there is a learning curve and I've had clients break sites from the backend. So it depends on how complex the theme is and how many plugins you are running.

                                            • 20. Re: how to best export from ID for build of Wordpress website?
                                              malch Level 1

                                              Everyone has been very patient and generous with such good, practical, real-world, advice.  These forums are amazingly helpful.  Thanks so much everyone,

                                              Malcolm

                                              • 21. Re: how to best export from ID for build of Wordpress website?
                                                BarbBinder Adobe Community Professional

                                                Come back and let us know how it goes!

                                                • 22. Re: how to best export from ID for build of Wordpress website?
                                                  malch Level 1

                                                  Yes I will do that!

                                                  Malcolm

                                                  • 23. Re: how to best export from ID for build of Wordpress website?
                                                    BobLevine MVP & Adobe Community Professional

                                                    Malcolm, Are you on LinkedIn?

                                                     

                                                    If so, the entire lynda library is free all week. There are some terrific WordPress courses there and if you’re even remotely interested in pursuing this and maintaining the site, I highly recommend them. I used those courses myself when I was starting.

                                                    • 24. Re: how to best export from ID for build of Wordpress website?
                                                      malch Level 1

                                                      I'll check them out right now Bob.  Thanks so much for the heads-up.

                                                      Malcolm

                                                      • 25. Re: how to best export from ID for build of Wordpress website?
                                                        rob day Adobe Community Professional & MVP

                                                        Muse sites are responsive and support SEO

                                                        Yes, I was assuming beginner level. I'm pretty comfortable coding PHP, HTML and CSS in Dreamweaver or a text editor, but long ago gave up building from scratch because the available (and inexpensive) boilerplate code and plugin options are so vast it becomes pointless.

                                                        • 26. Re: how to best export from ID for build of Wordpress website?
                                                          Laubender Adobe Community Professional & MVP

                                                          Hi Malcom,

                                                          I did not test this, but maybe it's something for you updating your WordPress site after it is set up:

                                                          Export Adobe InDesign to WordPress | iziExport

                                                           

                                                          Quoting the developers of iziExport:

                                                           

                                                          With this InDesign add-on, you can turn any InDesign article into a new WordPress post in a one-click process.

                                                           

                                                          Export is made at level article from InDesign. Contents to be exported must be tagged and added to the article.

                                                           

                                                          For export, tags can be classified into two categories:

                                                          - Basic tags: title, main text, image, caption. Basic tags are always exported.

                                                          - Extra tags: subtitle, summary, blob, etc. Extra tags export is optional. Contents are inserted to the end of the main text.

                                                           

                                                          Export directly the text of your InDesign articles to WordPress:

                                                          - iziExport detects automatically the title of the article, even when there are multiple fonts.

                                                          - Basic text styles (italic, bold, etc.) are kept when exporting.

                                                           

                                                          Images and vector graphics are automatically exported:

                                                          - iziExport optimize the images for web.

                                                          - Vector graphics are converted automatically to JPG format.

                                                          - Multiple images are turned into a WordPress image gallery.

                                                          - Image captions are exported along with its corresponding image.

                                                           

                                                          Before exporting, you can set WordPress categories, tags and custom fields:

                                                          - Export the InDesign article to WordPress in a one-click process.

                                                          - After exporting, the InDesign article is turned into a WordPress post, you can edit and publish it as any other post in WordPress.

                                                           

                                                          (XML-RPC protocol must be enabled on your WordPress site. You can check it out by entering the following URL on your Internet browser: http://YourDomain/xmlrpc.php

                                                          You should get back the following message: XML RPC server accepts POST requests only)

                                                           

                                                          More info at:

                                                          http://www.iziexport.com

                                                           

                                                          Regards,
                                                          Uwe

                                                          • 27. Re: how to best export from ID for build of Wordpress website?
                                                            malch Level 1

                                                            Very interesting.  Thank you Uwe... this might just save me a lot of time (since my current plan is to get my WordPress guy to build the site with all my content, according to my design, and then I'll be the one to fix all the fonts, etc., which I had assumed would be lost. 

                                                            So I'll ask my WordPress guy to check this out; I'll let you know whether it works or not (in a few weeks I hope, when he says he might have time to work on this project).

                                                            Regards, Malcolm

                                                            • 28. Re: how to best export from ID for build of Wordpress website?
                                                              rob day Adobe Community Professional & MVP

                                                              and then I'll be the one to fix all the fonts, etc., which I had assumed would be lost.

                                                              You might want to talk to your web guy about fonts. Using fonts that aren't in the universal defaults (Times, Helvetica, etc.) have to be loaded from your server via a PHP script and @font-face styles in your CSS, or loaded via a subscription service like Adobe's Typekit. The fonts also have to be web fonts—you won't necessarily be able to use any desktop font on your system. It will take some coding to set up the site for web fonts.

                                                               

                                                              How to Set Up Web Fonts for Wordpress

                                                              • 29. Re: how to best export from ID for build of Wordpress website?
                                                                malch Level 1

                                                                Okay... didn't know this Rob.  I just googled Web-Safe Fonts 2016 and see someone's list of 16 fonts that work with most everything.

                                                                16 isn't bad, but I was really hoping to use some interesting fonts like Book Antiqua and Hoefler Text (along with some others) in an effort to make certain entries easy to distinguish.  Grrrrr.  I see that you say that other fonts can be used if they're loaded via a PHP script—this is beyond me but I'll take it up with my web guy. 

                                                                Thanks for this.  The more I know going into this next web phase, the better.

                                                                Malcolm

                                                                • 30. Re: how to best export from ID for build of Wordpress website?
                                                                  BobLevine MVP & Adobe Community Professional

                                                                  Web safe fonts are relevant today as web safe colors.

                                                                   

                                                                  WordPress works wonderfully with Google Fonts.

                                                                   

                                                                  Check them out.

                                                                  • 31. Re: how to best export from ID for build of Wordpress website?
                                                                    rob day Adobe Community Professional & MVP

                                                                    Grrrrr.  I see that you say that other fonts can be used if they're loaded via a PHP script—this is beyond me but I'll take it up with my web guy.

                                                                     

                                                                    In the default WordPress backend you won't be able to choose fonts or really even design the pages—that all should happen in the theme adjustments. You can do some formatting in the content editor via HTML tags, but you can't easily customize an entire page. The point of content management systems like WordPress is to make the site design consistent and that happens with the chosen theme, plugins, and CSS styling, which I gather your web guy will provide. The font usage will be set in the site's style sheet. Without some added plugin you won't have a font list to choose from, with CMSs there is a clear separation of design from content.

                                                                    • 32. Re: how to best export from ID for build of Wordpress website?
                                                                      rob day Adobe Community Professional & MVP

                                                                      WordPress works wonderfully with Google Fonts.

                                                                      As well as the Typekit web fonts that come with CC subscriptions. (As I'm sure you know) the instructions on the Typekit site are fairly easy to follow, but it does require an edit to the WordPress header.php file in order to load the fonts.