properties-wp-theme

• Version 1.0
• Version 2.0

I created a wordpress theme based on HTML template from internet, below you can see what part of theme did i make and how i did it

Version 1.0

Header:

header.php

• Custom logo with displaying Site title and tagline
• Registrate wp nav menu - Top Menu

Template Parts:

Offer Header

• Offer header is the template-part
  • I use ACF on every page that use Offer Heaader - so Title and Under Title texts are apply to be change

Breadcrumbs

• Background image can be changed
  • If user didn't set an image - it will be default image
• It uses a ready function Breadcrumbs -

  ecoverde_the_breadcrumb()

• Displaying the title (not the same in property card)

Posts

• Posts are displayed with WP_Query with some arguments
• Type of Property depends on the taxonomy used

  $term->name

• Price displaying depends of what type of property it is. Rent - $300 / mo, Sale - $300
• Almost every feature display only if it's not empty
• Max lenght of title is 50 letters, then '...'

Front Page

front-page.php

• Displaying h1 title of the page
  • Replace / with < / br >
• Title Desc with ACF
• Main background image change with ACF
  • If doesn't set - will be replace by default image
• Offer Header
• Posts
  • User can choose how many posts will be shown

Category

templates/properties.php

• This file is a template that you can choose in adding new page
• Breadcrumbs
• Offer Header
• I thought it will be good idea to add tabs to filter post
  • I used isotope js file (AJAX filter that uses classes)
  • It's only small issue with pagination, i find the solve, but it's with js - Solve
• Pagination

Property card page

single-property.php

• It's a Custom Post Type that also use Taxonomy. To make CPT i used CPT UI plugin
• Breadcrumbs
  • I changed h1 and h2 tags because of SEO, people will search "The sky home", not "Property Details"
• Display Title (as the_title) and Description (as the_content)
• Other fields filled with ACF
  • Most of fields are not required, because it depends from what type of apartment it will be (for example: Flat, House, Sea House etc...
  • I change html by removing bootstrap, insted of it i make width 33% and float left. In previous case if some feature is empty - it just will be hidden but will stay in the same column. Now if some of features is empty another feature will take its plase
  • If description is empty people will see the message: "Oops, it's empty. You can return to the features tab"

Footer

footer.php

• The entire footer is made up of widgets
  • All menu links are with icons, so i made a JS code after < /footer > on 23th line. If shortly: i add < span > tag with class of icon before < a > tag in < li > tag

    :)

• Menu widgets are workable, you can click on every page

Pages

page.php

• You can see all the pages in footer. Here i use page.php file. Nothing special, breadcrumbs and content

Plugins that i used in my work

Higher i described how did i use them

• ACF
• CPT UI

Version 2.0

Here you can see changes that i made in second version of the website

Theme Settings in admin

templates/admin/admin.php

• Main Settings
  • User can choose how many posts will be shown on the front-page
• Social Media Settings
  • User can fill in links to his social media
  • Links will display with selfmade plugin 'Social Media'

Plugin 'Social Media'

plugin/social-media.php

• This plugin will display social media icons with shortcode [social_media] anywhere you want
• If user didn't fill in the field of social media it will not be shown

Front Page (correction)

front-page.php

• Now the number of posts is set on theme settings in admin
• Code is cleaner

Functions (correction)

functions.php

• register_post_type now in functions.php, plugin cpt ui was deleted

Functions (correction)

functions.php

• register_post_type now in functions.php, plugin cpt ui was deleted

Template Parts

Posts

• Tabs Have been redone without isotope
  • Were created new child pages Rent and Sale and now only related posts are shows
  • All scripts were deleted
  • Offer block with id, so now when people click on tab it's scrolling down to this block
• Code is cleaner

Functions (correction)

functions.php

• register_post_type now in functions.php, plugin cpt ui was deleted

Plugins

CPT UI - deleted

Social Media - created (shortcode plugin)