WordPress Layout for Online Magazine

5,926 views

Published on

Online Magazine layout slide for Bandung Blog Village's workshop: "Online Magazine for High School Student using WordPress", Comlabs ITB Dec 20, 2008

Published in: Business, Technology
4 Comments
2 Likes
Statistics
Notes
No Downloads
Views
Total views
5,926
On SlideShare
0
From Embeds
0
Number of Embeds
49
Actions
Shares
0
Downloads
244
Comments
4
Likes
2
Embeds 0
No embeds

No notes for slide

WordPress Layout for Online Magazine

  1. 1. Wordpress layout for online magazine by Bandung Blog Village: http://www.flickr.com/photos/kymberlyanne/2913332849/ Ryan (deathrockstar.info) & Diki (chickenstrip.org)
  2. 2. Who am I ? Ryan - blogger & journalist @ www.deathrockstar.info - music enthusiast & college student (ars unpar) Diki - blogger & comic artist @ www.chickenstrip.org - web programmer & (formerly) web designer
  3. 3. 1 wplayout http://www.flickr.com/photos/sheriffof0/3001692951/
  4. 4. default theme blog banget, xoxo...
  5. 5. theme introduction
  6. 6. header post sidebar menu footer (widgets)
  7. 7. http://www.flickr.com/photos/blackbiscuits/1615652119/ 2 magazinelooks
  8. 8. professional magazine
  9. 9. cnn.com
  10. 10. how about wp based ?
  11. 11. media-ide.com
  12. 12. twentea.com
  13. 13. http://flickr.com/photos/cayusa/2896983287/ 3 okay,how?
  14. 14. download arthemia magazine-like – made in bandung!
  15. 15. extract to /wp-content/themes
  16. 16. wp-admin, appearance, arthemia
  17. 17. select & activate
  18. 18. voila! getting close! still need some customization
  19. 19. Arthemia Rules - create “headline” and “featured” category - make arthemia's files writable - hack some index.php codes for categories - make the folder “scripts” and “cache” writable - custom field “Image” on the post (with image path.. not URL, for auto image resize)
  20. 20. create categories
  21. 21. 8 category 7 6 edit index.php 5 4 3 1 home 3 6 5 4 8
  22. 22. set headline & featured
  23. 23. headline/featured custom field: Image
  24. 24. widgets, plugins, css, custom images
  25. 25. magazine looks customize more!
  26. 26. http://flickr.com/photos/ikhlasulamal 4 designtrend
  27. 27. round flashes mirror effect / reflection glossy/sheen, 3D effect gradients diagonal lines rounded corners vibrant, background hi-contrast solid? colors gradient? clean white? plenty of spaces, clear text Also: centered layout, oversize text, glossy icons, highlight area, screenshot reflection web 2.0-ish?
  28. 28. http://flickr.com/photos/quinndombrowski/2587844905/ and one more thing...
  29. 29. Thank You ! http://www.slideshare.net/niwat0ri Diki Andeas aka. niwat0ri Email: niwatori@gmail.com Website: www.chickenstrip.org Credits: Free images taken from www.sxc.hu Flickr CreativeCommons licensed image collections (URL at each page) Ryryn & Puty Karina Puar's image collections

×