make more money with advanced custom fields - wordcampyyc 2015

Post on 12-Apr-2017

425 Views

Category:

Technology

0 Downloads

Preview:

Click to see full reader

TRANSCRIPT

Take full control of your edit screens

Cleaner & more predictable front-end

Charge more for your work!

NutshellIN A

<div class="row callout-wrap"> <div class="thirdcol first co-1"> <div class="callout-title"> Upcoming Events </div> <div class="callout-img"> <img src="images/callout-horse-white.png"> </div> <div class="callout-tagline-wrap"> <p>Spend a day at the</p> <p class="emph">races</p> <a class="callout-button">Race Schedule >></a> </div> </div> <div class="thirdcol co-2"> <div class="callout-title"> Farmer's Market </div> <div class="callout-img"> <img src="images/callout-wheat.png"> </div> <div class="callout-tagline-wrap"> <p>Now with longer</p> <p class="emph">hours</p> <a class="callout-button">Market Info >></a> </div> </div> <div class="thirdcol last co-3"> <div class="callout-title"> Available Services </div> <div class="callout-img"> <img src="images/callout-campfire.png"> </div> <div class="callout-tagline-wrap"> <p>We have so much</p> <p class="emph">more</p> <a class="callout-button">What we offer >></a> </div> </div> </div>

Callouts

Callouts

3

1

2

ACCESS TO YOUR THEME’S PHP

BASIC THEMING PRACTICES

BASIC-ER PHP SYNTAX

FIELD 1: BACKGROUND IMAGE

FIELD 2: HEADLINE

FIELD 3: TEXT

FIELD 4: CALL TO ACTION BUTTON TEXT

FIELD 5: BUTTON LINK

<div class=“inner-container” style=“background: url(/images/flamesbg.jpg) no-repeat center center; background-size: cover;”>

</div>

<img src=“/images/flames-logo.png” alt=“Flames logo”>

<h1>The Calgary Flames have made the playoffs!</h1>

<p>Tickets will be made available to non-season ticket holders via a lottery system. Sign up today!</p>

<a class=“button” href=“http://www.calgaryflames.com/tickets”> I WANT TO BE PART OF THE C OF RED </a>

FIELD 1: BACKGROUND IMAGE

FIELD 2: HEADLINE

FIELD 3: TEXT

FIELD 4: CALL TO ACTION BUTTON TEXT

FIELD 5: BUTTON LINK

Flames Background

flames_background

Flames Background

flames_background

Flames Headline

flames_headline

Flames Text

flames_text

Flames Button Text

flames_button_text

Flames Link

flames_link

<?php /*Template Name: Home*/ ?>

<?php get_header(); ?>

<div class="row"> <div class="page-content"> <h2> <?php the_title(); ?> </h2> <?php the_content(); ?> </div> </div>

<?php get_footer(); ?>

<?php /*Template Name: Home*/ ?>

<?php get_header(); ?>

<?php get_footer(); ?>

<div class="inner-container" style="background: url(/images/flames-bg.jpg)” no-repeat center center; background-size: cover;"> <img src="/images/flames-logo.png" alt="Flames logo"> <h1> The Calgary Flames have made the playoffs! </h1> <p> Tickets will be made available to non-season ticket holders via a lottery system. Sign up today! </p> <a class="button" href="http://www.calgaryflames.com/tickets"> I WANT TO BE PART OF THE C OF RED </a>

</div>

<?php the_field('field_name'); ?>

<?php the_title(); ?><?php the_content(); ?>

WORDPRESS TEMPLATE TAGS

ACF FIELD TAGS

<?php get_header(); ?>

<?php /*Template Name: Home*/ ?>

<?php get_footer(); ?>

<div class="inner-container" style="background: url(/images/flames-bg.jpg)” no-repeat center center; background-size: cover;"> <img src="/images/flames-logo.png" alt="Flames logo"> <h1> The Calgary Flames have made the playoffs! </h1> <p> Tickets will be made available to non-season ticket holders via a lottery system. Sign up today! </p> <a class="button" href="http://buildstudio.ca/acftalk/order-tickets"> I WANT TO BE PART OF THE C OF RED </a>

</div>

<?php get_header(); ?>

<?php /*Template Name: Home*/ ?>

<?php get_footer(); ?>

<div class="inner-container" style="background: url(<?php the_field('flames_background'); ?>)” no-repeat center center; background-size: cover;"> <img src="/images/flames-logo.png" alt="Flames logo"> <h1> <?php the_field('flames_headline'); ?> </h1> <p> <?php the_field('flames_text'); ?> </p> <a class="button" href="<?php the_field('flames_link'); ?>"> <?php the_field(‘flames_button_text'); ?> </a>

</div>

Beat the Canucks! Make them cry!

Woohoo!!!!!!!

We made the playoffs, baby!

Beat the Canucks! Make them cry!

Woohoo!!!!!!!

We made the playoffs, baby!

BRING ON THE DUCKS

Holy Crap We Did It

The Flames Have Advanced to the Second Round!

Holy Crap We Did It

The Flames Have Advanced to the Second Round

BRING ON THE DUCKS

FIELD 1: PLAYER PHOTO

FIELD 2: PLAYER

NAME

FIELD 3: PLAYER

POSITION

Players

Players

Flames Players

flames_players

Flames Players

flames_players

Flames Players

flames_players

Flames Players

flames_players

Player Photo

player_photo

Flames Players

Player Name

player_name

Flames Players

Player Position

player_position

Players

Flames Players

flames_players

Flames Players

flames_players

Add Player

Add Player

<div class="inner-container"> <img src="/images/flames-logo.png" alt="Flames logo"> <h1>Flames Players</h1> <div class="bio"> <img src="images/glencross.jpg"> <div class="bio-text"> <h2>Curtis Glencross</h2> <p>Left Wing</p> </div> </div>

<div class="bio"> <img src="images/hiller.jpg"> <div class="bio-text"> <h2>Jonas Hiller</h2> <p>Goaltender</p> </div> </div>

<div class="bio"> <img src="images/monahan.jpg"> <div class="bio-text"> <h2>Sean Monahan</h2> <p>Center</p> </div> </div>

</div>

if(get_field('repeater_field_name')): while(has_sub_field('repeater_field_name')): ?>

<?php

<!--subfield 1 content--> <?php the_sub_field('sub_field_1'); ?> <!--subfield 2 content--> <?php the_sub_field('sub_field_2'); ?>

<?php endwhile; ?> <?php endif; ?>

if(have_posts()) while(have_posts()): the_post(); ?>

<?php

<?php the_title(); ?> <?php the_content(); ?>

<?php endwhile; ?> <?php endif; ?>

ONE EXAMPLE OF THE WORDPRESS LOOP

THE ACF REPEATER LOOP

Players

Flames Players

flames_players

if(get_field('repeater_field_name')): while(has_sub_field('repeater_field_name')): ?>

<?php

<!--subfield 1 content--> <?php the_sub_field('sub_field_1'); ?> <!--subfield 2 content--> <?php the_sub_field('sub_field_2'); ?>

<?php endwhile; ?> <?php endif; ?>

if(get_field(‘flames_players')): while(has_sub_field('flames_players')): ?>

<?php

<!--subfield 1 content--> <?php the_sub_field('sub_field_1'); ?> <!--subfield 2 content--> <?php the_sub_field('sub_field_2'); ?>

<?php endwhile; ?> <?php endif; ?>

<div class="bio"> <img src="images/glencross.jpg"> <div class="bio-text"> <h2>Curtis Glencross</h2> <p>Left Wing</p> </div> </div>

if(get_field('flames_players')): while(has_sub_field('flames_players')): ?>

<?php

<?php endwhile; ?> <?php endif; ?>

<div class="bio"> <img src="<?php the_sub_field(‘player_photo'); ?>"> <div class="bio-text"> <h2><?php the_sub_field(‘player_name'); ?></h2> <p><?php the_sub_field(‘player_position’); ?></p> </div> </div>

if(get_field('flames_players')): while(has_sub_field('flames_players')): ?>

<?php

<?php endwhile; ?> <?php endif; ?>

if(get_field('flames_players')): while(has_sub_field('flames_players')): ?>

<?php endwhile; ?> <?php endif; ?>

<div class="bio"> <img src="<?php echo get_sub_field(‘player_photo'); ?>"> <div class="bio-text"> <h2><?php echo get_sub_field(‘player_name'); ?></h2> <p><?php echo get_sub_field(‘player_position'); ?></p> </div> </div>

<div class="inner-container"> <img src="/images/flames-logo.png" alt="Flames logo"> <h1>Flames Players</h1>

<?php get_header(); ?>

<?php get_footer(); ?>

<?php /*Template Name: Players*/ ?>

Players

Players

Players

Players

Curtis Glencross Left Wing

Players

Jonas Hiller Goaltender

Players

Sean Monahan Centre

Players

Players

Players

Players

Sam Bennett Centre

Global fields in a custom options area

Global fields in a custom options area

Calls to Action

Calls to Action

MoneyMAKE MORE

Edits are made when you want them, not when I

can do them

MoneyMAKE MORE

I can now be hit by a bus

MoneyMAKE MORE

One less thing to train staff

MoneyMAKE MORE

Hiring requirements just became a little more

relaxed

MoneyMAKE MORE

Say goodbye to the minimum charge

MoneyMAKE MORE

top related