WordCamp BHM

WordCamp Birmingham:

http://2014.birmingham.wordcamp.org

Well, here’s my comments on my first WordCamp –  BHM Wordcamp 2014. I learned a lot and met a lot of great folks. Most of all I was inspired not only to keep on going with WordPress, but  how to do so more efficiently. There were some hosting and other sponsors there with good offerings, the speakers were very informative and entertaining. I liked the lunch voucher that allowed a variety of places to eat. The venue was also great. I liked that it was a one day event. Heck, I even liked the thin cotton t-shirt, and this is coming from a t-shirt snob, whose t-shirt drawer runneth over. All in all one of the best days and $20 I’ve spent in quite a while. If you want a run down of the schedule and my personal notes on each, keep on reading.

My most memorable lines of the whole shebang are two quotes from the debugging session:

“If you have to or just simply choose to be a Cowboy Coder, that is wear the Pink Sombrero, there are somewhat appropriate ways of doing so.” This quote was in relation to a last ditch effort or quick testing on a live site. If it is required, or if you just feel it is appropriate, please wrap your code in an if IP block, so that whatever changes/testing you are doing is only seen by your IP and not the entire public.

“Duck Decoding”. This quote was in reference to explaining what you are trying to do with your code. That is talk out the psuedocode. Then talk out the details. It is easy to forget a simple detail if you are speaking to or reviewing it with yourself, but explaining it to someone else sometimes identifies the problem. If no one is around or willing to listen to your problems or code, explain it to the rubber duck on your desk, or whatever entity you wish.

ToDos – Inspired from the WordCamp:

  • setup up meetup account
  • get involved with worPress meetups – make.wordpress.org
  • check out SiteGround hosting options – > WP specific  – DEV > PRE > PROD options (they are not free, but seem to have good enterprise services)
  • Check out Visual Form Builder Pro – WP/Scheduling/PayPal Integration more…
  • Get SublimeText setup instead of using Notepad ++. This seems to be a developer standard. SublimeText is FREE and MUCH better than notepad++.

 

Schedule

All these sessions are in the “Developer” category except the Freelance workshop

8:00 – registration

9:00 – 10:40 – Freelancer workshop

10:40 – 11:30 – Battle for front end Framework: Bootstrap vs foundation

11:30 – 12:20 – Using SVG to create dynamic maps and other cool things

lunch

2:00 – 2:50 – Keynote speaker

2:50 – 3:40 – 3 sites in 6 weeks

3:40 – 4:30 – Validating, Sanitizing and escaping wordpress themes and plugins

4:30 – 5:20 – Debugging

Freelancer Workshop – Hosted by Nathan Ingram – brilliantly.net?

LLC $85 – one page form/doc – easy easy…

The Consultant Sale – Listen to the clients needs, let them talk (they like to talk), listen %80 of the time

Dont Talk BUDGET, talk WORTH (put the spin on it)

Proposals presented in person to the decision makers

Sites to check out:

easy wpguide.com – one page web guide for basic user.

adminimize  – remove stuff in the admin so the client can’t mess it up

Advanced Acess manager

Vimeo Everywhere < – puts vimeio videos inside the admin

itheme secruity  – check this out too

webdesign.com – online web training (may be free)

Updates are required – This presents the biggest Security hole in WordPress

Getty images letter – Beware! if you get images off of google images search…

 

Battle for front end Framework: Bootstrap vs foundation – Hosted by : Rachel Carden – wpdreamer.com (Works at US in Rose Admin – sent thank you email):

BS= Bootstrap / F = Foundation / B = Both

BS: developed by Twitter, Uses LESS or SASS, More popular

F: Only SASS (not a real big deal SASS looks better anyway)

Both Can use a custom build(from their site) but Bootstrap is MUCH longer (with the big long screen of options).

BS: uses a fixed grid, jumps to next smallest box size, but can be changed to a fluid grid system.

F: Uses a fluid grid by default.

B: uses the 12 column grid system

B: nest grids, Offset cols shift order of columns (Pushing or pulling)

B: have visibility classes to show/hide columns based on screen size/display

F: has center columns, blocked grid thumbs

B: has more stylized components (rounded corners, shadows more CSS3 use), Foundations are more plain (and ready for you to style them)

F: has more JS Plugins, and mobile friendly content, equalizer ect..

F: has Off canvas menu(side menu), Bootstrap doesn’t (at this time)

B: if you want responsive elements, Forms/tables, images, you have to add a class into the HTML, Foundations does not require this.

F: wins Out Of the Box no need to add class names into HTML

B: Wins Browser support (Just barely, because of IE8)

F: Revelry – free themes for Foundation.


Using SVG to create dynamic maps and other cool things – Hosted by scubakyle@gmail.com:

SVGs – Scaled Vector Graphics

Each path can be controlled/style by CSS and moved/animated by JavaScript! THIS IS HUGE!

What Browsers support this: Not IE8, Most other ones yes, even mobile.

Can you use SVGs for repeating backgrounds. YES – Get example and work it up for the redTechDesign Bg.

css-trics.com/mega-list-svg-information < – check this out for more examples

Post to post – connecting WP Settings/options/variables with SVG using custom post types

Slideshow notes, SVG map and post2post plugin: wpyall.webdevkyle.com

Inkscape can create SVGs for free.

3 sites in 6 weeks session (Developer session 2:50PM) – Hosted by :

  • Harris Publications – magazine publications out of NY (Antenna, real world survivor, and personal defense world)
  • 3 designs were provided to them.
  • Using the parent/child theme route (page views were focused as this is the main source of revenue)
  • parent/child themes best fit a network of site with the information architecture are similar across sites. Parent them is like the floorplan, but the childtheme is elevation,details
  • Multi-site implementation
  • Ease of updates and bug fixes (fix a bug in one place instead of 3 places)
  • ADD_THEME_SUPPORT <– USED THIS HOOK
  • used custom post types (to allow 8 different paper publications to be listed inside one of the child worpress admins)
  • ???
  • Shadow taxonomy – associate an article with a publicaiton/issue, piggybacks taxonomy.
  • added a “Cover story” checkbox on the publish pane.
  • www.allenmoore.me/setting object terms with a a checkbox…. (see link)

 Sanitizing, Validating & Escaping in WordPress Themes and Plugins – Hosted by :

  • wpscholar.com/wpyall2014 <– slides and other info…
  • sanitize_text_field <– this is a default WP function
  • sanitize_title <– this is for URL slugs
  • esc_url_raw<– for urls
  • sanitize_email <– for emails
  • sanitize_html_class
  • wp_kses_post <– allowed HTML tags and attributes.
  • wp_kses_data <– used for comments
  • many, many others…
  • Validatioan – additional checks on top of sanitization.
  • balanceTags <– will add tags where appropriate.
  • Nonce <–validate that a user wants to do something.
  • Escaping – Securing the output
  • Escaping SQL Queries
  • wpdb-> prepare…
  • VIP scanner is a plugin that can be used to scan theme
  • search for echo $ or echo get_

Debugging – Hosted by :

  • briandichiara.com
  • supportdetails.com <– gets info on their system and they can email it to you
  • whoishostingthis.com
  • Using a staging site
  • WPEngine or SiteGround
  • stagin1.domain.com or domain.staging.company.com
  • Database string replace
  • Use Bit Bucket (Dev/Stag/Master(Prod))
  • setup and run locally (AMPPS, SAMPP, MAMP Pro)
  • FTPloy – will migrate code up the chain from dev > stag > prod
  • Sublime Text – sublime linter plugin
  • PhpStorm
  • xdebug – installed on server…
  • enable WP_DEBUG
  • vagrant vagrant, and serverpress
  • WP_DEBUG_LOG(false)
  • WP_DEBUG_DISPLAY(false)
  • Review the NittyGritty slide!
  • debug_backtrace() – helpfulf for hooks
  • when writing new stuff, use the var_export() function to log all errors to be handled
  • console.log()<– use in Java script
  • die(‘1’); <– tedious and last resort process
  • check on the IP address $SERVER[‘REMOTE_ADDR’]   &&   $SERVER[‘http_x_forwarded_forREMOTE_ADDR’]
    ?????

 

WordPress First Steps

Primary Objectives:

  1. Get a Domain Account and domain name
  2. Setup WordPress using “Quick Install”
  3. First Post
  4. Deciding between using Pages or Posts
  5. Creating Categories
  6. Setting up a main menu
  7. Deciding on a Theme
  8. To allow comments or not
  9. adding media/pics
  10. Other Questions

 

1) Get a domain account:

~$60/year  with most major providers. Domain Names are only about $15/year

  • wordpress.org/hosting
  • godaddy.com
  • hostgator.com
  • bluehost.com

Most of these providers (and just about everyone else) should include WordPress Support or Install tools to make it super easy to install WordPress.

Other things to keep in mind when picking a domain name

  • Just type it into a browser to see if it is available
  • Beware of domain frontrunning (where you search for a domain using their tool and go back later to purchase it, only to find out someone else has it and wants to sell it for more)
  • Keep keywords in mind, but don’t make it too hard to remember
  • If you want more than one website, many can be hosted under one account using Add-On domains, Separate WordPress Admins for each one, just purchase additional domain names for each site.

2) Setup WordPress using “Quick Install”.

demonstration here using previously setup subdomain…

Control Panel (cPanel) > Quick Install,

Can check auto updates

Once WP is installed, change PW immediately!

 

Other host providers may vary…

previously I used Fantastico, which also worked well from my experience.

 

3) First Post

  • demonstration here, note the welcome page that is already created
  • quick overview of content editor (Mini-Word Editor)

4) Deciding between using Pages or Posts

  • Pages if you want a simple web presence (5 or 6 main pages that will remain fairly consistent)
  • Posts if you want to constantly write articles about a certain topic or topics
  • Posts if you want users to be able to post comments, encourage discussion (you can allow comments for a page, but this is not common)
  • You can edit either (Post or pages) at any time, so don’t think you HAVE to use posts if you want to edit/append information

5) Creating Categories

  • Think keywords or main subjects of interest
  • demonstration

6) Setting up a main menu

  • can be done using post categories or pages
  • demonstration
  • list of links (for linking to other web sites)

7) Deciding on a Theme (Layout)

  • There are a few installed for you by default
  • There are literally thousands of Themes available for free
  • Consider responsive design – will adjust to different sized screens or devices
  • You can switch themes really easily/quickly
  • You can still change colors/backgrounds etc. using options for a theme, so don’t pick a theme just because you like a color/texture/featured image

8) To allow comments or not

  • Can lead to spam, which can be dealt with using Akismet (0 – 120$ per year)
  • Good to encourage discussion/interaction.
  • If you are just using the site as a web presence, you probably don’t want this feature on all pages
  • You can choose to allow comments on some posts, and not allow them on others.

9) Using media

  • Single photos
  • Galleries – NextGen is most popular, many features. Example:
  • Video (test this first) embed youtube

10) Other Questions

  • 15 WordPress Beginner Questions
  • Social Media Integration – Some themes have this by default
  • Adding other Admin users – If you want other people to help you manage the site
  • popular plugins – e-commerce, sliders

 

Ampersand Presentation Setup Notes:

blue cord laptop to TV (Source button – set to PC)

Laptop Settings > Control Panel > Hardware > Display > Connect to a Projector > Extend (the desktop, keeping my laptop screen private, but allowing a new display window for public viewing)