Web Design Archives - Wordpress Web Development Agency in London specialise in helping Charities

Jan 13

0

Why link your website to your CRM

By louie171 | Customer Relationship Management - CRM, Forms, HubSpot, Marketing Automation, Web Design, Wordpress | No Comments

This post runs over why you would connect a CRM (Customer Relationship Management) system ( such as Hubspot) to your website.

Many CRMs now allow you to capture form data on your website and pull this into the CRM, this has the following benefits to you:

store users information in your CRM
be able to follow up in CRM and have all the interactions in CRM so you can see the history of interactions with that person
see what the user has been looking at on your website

The are 2 main ways of taking the users details from your website:

a form (standard or popup)
a chat box

An example form might look something like above ( this is one I’ve generated in Hubspot , but you can customise and generate your own forms in many ways in Hubspot, manually with HTML or with a tool such as Gravity forms for WordPress, or with other tools). Also remember to make sure you are GDPR compliant if your in the EU.

When the user submits the above form, this is what is will look like in Hubspot.

As you can see the data from the form is recorded in the activity section above and a new contact (Beavis) has been generated in the CRM contacts database. Where you can record all your interactions with this contact ( email , phone and so on ). Emails can also be automatically logged into your CRM and you can automate replies to emails with Marketing Automation sequences. This can be very useful when you have a large number of users (for example your supporters contacting your Charity or Not for Profit Organisation).

I’ve been using Hubspot in this article but the same can be done with others such as Salesforce ( and many others ). I haven’t gone into much technical detail in this post, only why and what are the benefits of this.

CRMs are great for following up and interacting with your supporters, customers, leads and so on. I hope I’ve shown you how you can easily ( and automatically ) put form contacts from your website into your chosen CRM, to make this process easy and save you time.

I plan to write another article on the technical aspects of how todo, what I’ve described briefly ( integrate your WordPress website with a CRM like Hubspot) in the coming months, but if you’d like help with doing this then please contact us below.

Feb 09

0

How to engage your staff using your Intranet

By louie171 | Buddypress, Intranet, PHP, Web Design, Wordpress | No Comments

In this article, we’ll look at some ideas for useful things to have on your intranet and how to use these to help engage your Employees, members or Volunteers.

What are the benefits of engaged staff ?

Happy workforce ( productive workforce, helps business be more profitable)
Low Staff turnover ( saves money in recruitment and training)

Useful Intranet features for employee engagement

Employee Recognition Section

Make your staff feel engaged by recognising them and their achievements ( both personal and professional ). A section on your homepage for this would really make people feel valued, and a good way for other employees to spark up a conversation with the recognised individual ( or team) Some ideas of the kind of thing to recognise:

An employee has a work anniversary
An employee is doing a Marathon for charity
A employee or team have delivered a great project that will help company save money
The works Football team are doing well

“Our Intranet features a news feed with stories of employee honors and work anniversaries, volunteering, company sponsorships and other news with links to more details. It can be a challenge sharing our culture across four states in a regulated industry. But people love reading about and seeing images of colleagues they know as well as those they’ve never met. By far we’ve gotten the most engagement posting photos of employees in Halloween costumes and celebrating Ugly Sweater Day. In a regulated industry, the simple, silly things unite us and we laugh together. ” – An Intranet Manager I interviewed that wishes to remain anonymous.

New Employees Section

Welcome your new employees, with a section on the homepage, linking to their staff profiles.

Suggestions

Have somewhere, that employees can easily post suggestions, to save money, to make staff more engaged, to make money and so on. Your staff are your businesses greatest asset ( often the ones on the shop floor close to certain areas of the business can deliver great insights – that might otherwise never come to light). You could incentivise with a monthly prize for the best suggestion.

Personalisation

Display relevant content to the Intranet visitor based on one or a number of criteria ( or even let users pick what they want to see).

Displaying content based on a Persona

E.g. one type of persona could be ‘New Starter’ , are there any important documents they need to read, are their specific forms they might need to fill ( eg bank details so they can get paid on time).

If your a large organisation (with multiple locations across the globe) you might want display things based on the location, or the team ( maybe HR need to see something different to IT and so on).

Allowing Users to pick content they are interested in

You can let users pick some of the content they are interested in and have it displayed prominently for them.

Are you looking to have an intranet developed or would like to upgrade / improve your existing Intranet ? Get in touch we’re experts in this area.

Oct 04

0

Using WordPress as a Company Intranet

By louie171 | Intranet, PHP, Web Design, Wordpress | No Comments

WordPress can be a great choice as a company / staff Intranet, but it’s important to first define what features you need. Then to either code the features or choose plugins to use / customise.

Being a programmer, I think WordPress is an excellent intranet choice, the WordPress API allows you to customise things to how you want.

In this article I’ll later discuss some useful plugins for some of the main features.

Common features of a staff intranet

There are many possible features an Intranet website can have, these are probably the ones that nearly all Intranets will need.

Company news
Knowledge base / Document management System
Staff Directory and Profiles

Other features a company Intranet may need:

Forms ( online / downloadable printable forms )
Staff Events Calendar
Blog/s
HR section (policies and the like )
Social network features (such as groups, group threads, user to user messaging )
WordPress integration with Microsoft Active Directory (if you choose WordPress and your on a windows network)

Look and feel and navigation

This is down to preference, but some things to consider are:

Company branding
A good homepage will have latest news prominently displayed.
Good navigation and Search feature to allow staff to navigate to the things that important to them.

How to achieve the main Intranet features with WordPress

Document Management

WordPress has basic document management built into it as standard through the media library, which for many organisations will do what you need.

For basic Document Management on an Intranet you need to ability to:

Upload a file and store it
Generate a link to the file that can be used anywhere on the Intranet (allowing easy access)

Once you have this functionality you can create pages and put the documents on the pages, eg you might have a HR (Human Resources) section that has a policy documents page (just add the links to the page). Go to the file in the media library and get the link like in the image below:

If you want to go further, an example might be wanting to have review dates for documents. So you can guarantee that policies and training documents etc are upto date, then a good starting point is the WP Document Revisions Plugin (you’ll need to customise it alittle for review date functionality):

https://wordpress.org/plugins/wp-document-revisions/

Company News

The blog feature of WordPress can be used for posting articles on any topic. If you want to create a company news section, a simple way is to create a category type of ‘company news’ and then add this to any post you want to have in the company news section.

E.g if I wanted a Javascript posts section on my website I could create ‘javascript’ category and then all the javascript posts are on this page: http://www.green-box.co.uk/category/javascript/ ( so long as i tag each post with that category ).

You probably want this also on your homepage, todo this alter the template for the homepage and drop in something like below or use a widget if you have widget areas and don’t want to touch any code https://en-gb.wordpress.org/plugins/category-posts/ .

<?php global $more;

$cat = array(24); // id of category you want to display
       $args=array(
            'category__in' => $cat, 
            'orderby' => 'post_date',
           'order' => 'DESC',
           'posts_per_page' => 5,
           'paged'=>get_query_var('paged')
           );    
    
$my_query = new WP_Query($args);

?>

<?php while ($my_query->have_posts()) : $my_query->the_post(); ?>
        <hr/>
        <div <?php post_class(); ?>>
            <h3 class="entry-title"><p align="left"><a href="<?php the_permalink(); ?>" rel="bookmark" title="<?php printf(__('Permanent Link to %s', 'gpp_i18n'), the_title_attribute('echo=0')); ?>"><?php the_title(); ?></a></h3></p><br>
            <div class="entry">
    <?php global $more;
    $more = 0;
    the_content(); ?>
        <?php wp_link_pages(array('before' => '<div class="page-link">' . __('Pages:', 'gpp_i18n'), 'after' => '</div>')); ?>
            </div><div class="clear"></div>
        </div><div class="clear"></div>
        <p class="postmetadata"><?php the_time(__('M d, Y', 'gpp_i18n')); ?> by <a href="/?author=<?php the_author_ID(); ?>"><?php the_author_nickname(); ?></a> | <?php _e('Categories: ', 'gpp_i18n');
        if (the_category(', ')) the_category(); ?> <?php if (get_the_tags()) the_tags(__('| Tags: ', 'gpp_i18n')); ?> </p>
        
<?php endwhile; ?>

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

<?php global $more;

$cat = array(24); // id of category you want to display

$args=array(

'category__in' => $cat,

'orderby' => 'post_date',

'order' => 'DESC',

'posts_per_page' => 5,

'paged'=>get_query_var('paged')

);

$my_query = new WP_Query($args);

?>

<?php while ($my_query->have_posts()) : $my_query->the_post(); ?>

<hr/>

<h3 class="entry-title"><p align="left"><a href="<?php the_permalink(); ?>" rel="bookmark" title="<?php printf(__('Permanent Link to %s', 'gpp_i18n'), the_title_attribute('echo=0')); ?>"><?php the_title(); ?></a></h3></p><br>

<?php global $more;

$more = 0;

the_content(); ?>

<?php wp_link_pages(array('before' => '<div class="page-link">' . __('Pages:', 'gpp_i18n'), 'after' => '</div>')); ?>

</div><div class="clear"></div>

<p class="postmetadata"><?php the_time(__('M d, Y', 'gpp_i18n')); ?> by <a href="/?author=<?php the_author_ID(); ?>"><?php the_author_nickname(); ?></a> | <?php _e('Categories: ', 'gpp_i18n');

if (the_category(', ')) the_category(); ?> <?php if (get_the_tags()) the_tags(__('| Tags: ', 'gpp_i18n')); ?> </p>

<?php endwhile; ?>

Staff Directory and Profiles

There are many plugins for creating staff directories, this depends on your needs. A straightforward one is Ultimate member:

https://wordpress.org/plugins/ultimate-member/

Another good one (with lots of features), is Buddypress. This one might be overkill if you want basic staff directory. It has member features for creating a social network – such as groups, member to member messaging and so on.

https://en-gb.wordpress.org/plugins/buddypress/

Conclusion

I hope this gives you some insight in creating an Intranet with WordPress. Although I’ve only touched on some of the basic features here.

If you’re planning an Intranet or would just like to know more, enter your email below to receive my free pdf which goes into much more depth on creating some other features that you might find useful things like:

being able to easily create forms
integrating WordPress with Microsoft Active Directory

If you’d like my free PDF on Intranet Development with WordPress please enter your email below:

please email me on [email protected]

Oct 19

0

How to do Ajax in WordPress

By louie171 | Ajax, Javascript, Web Design, Wordpress | No Comments

updated 10th Jan 2018

Write a javascript function to trigger the ajax call

    jQuery('#button_or_something').on("click", function() {
            
     
        jQuery.ajax({
            url: ajax_object.ajax_url,
            data: {
                action: 'like_or_not',  /* this is appended to add_action on server side */
                id: '99'
            },
            type: 'GET',
            success:function(response){
                //alert('back from ajaxe '+response);
                
                /* if you want to update something based on the response text */                        
                jQuery('#gb_div_to_update').html(response);        
            
                       

            }




        });
            
		
    });

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

jQuery('#button_or_something').on("click", function() {

jQuery.ajax({

url: ajax_object.ajax_url,

data: {

action: 'like_or_not', /* this is appended to add_action on server side */

id: '99'

},

type: 'GET',

success:function(response){

//alert('back from ajaxe '+response);

/* if you want to update something based on the response text */

jQuery('#gb_div_to_update').html(response);

}

});

Put js above in my_js_file.js (see later in this post).

Wrap in code below for nice loading:

jQuery( document ).ready(function() { put above code here });

To see how to send a form via ajax see here.

Write a php function to handle the ajax call (you could put this in functions.php)

add_action('wp_ajax_nopriv_like_or_not', 'green_like_or_unlike');   
add_action('wp_ajax_like_or_not', 'green_like_or_unlike'); /* notice like_or_unlike appended to action name of wp_ajax_ */


function green_like_or_unlike() {

    
   echo "hitting the php function ok";
   die(); // gets rid of the 0 at the end of ajax response
    
    
}

1

2

3

4

5

6

7

8

9

10

11

12

add_action('wp_ajax_nopriv_like_or_not', 'green_like_or_unlike');

add_action('wp_ajax_like_or_not', 'green_like_or_unlike'); /* notice like_or_unlike appended to action name of wp_ajax_ */

function green_like_or_unlike() {

echo "hitting the php function ok";

die(); // gets rid of the 0 at the end of ajax response

}

There is one final piece, you might notice the ajax_object.ajax_url in the Javascript function above. We need to make this available in the js file that this function is in. This needs to be done in php.

wp_localize_script( 'green-script', 'ajax_object',
            array( 'ajax_url' => admin_url( 'admin-ajax.php' ), 'we_value' => 1234 ) );

1 2	wp_localize_script( 'green-script', 'ajax_object', array( 'ajax_url' => admin_url( 'admin-ajax.php' ), 'we_value' => 1234 ) );

Include ajax_url like this (below)

function theme_enqueue_styles() {

    /*
     * include the js
     */

    wp_enqueue_script('green-script', get_stylesheet_directory_uri() . '/my_js_file.js', array('jquery'));

        
    // in JavaScript, object properties are accessed as ajax_object.ajax_url, ajax_object.we_value
	wp_localize_script( 'green-script', 'ajax_object',
            array( 'ajax_url' => admin_url( 'admin-ajax.php' ), 'we_value' => 1234 ) );
    
    
}

add_action('wp_enqueue_scripts', 'theme_enqueue_styles');

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

function theme_enqueue_styles() {

/*

* include the js

*/

wp_enqueue_script('green-script', get_stylesheet_directory_uri() . '/my_js_file.js', array('jquery'));

// in JavaScript, object properties are accessed as ajax_object.ajax_url, ajax_object.we_value

wp_localize_script( 'green-script', 'ajax_object',

array( 'ajax_url' => admin_url( 'admin-ajax.php' ), 'we_value' => 1234 ) );

}

add_action('wp_enqueue_scripts', 'theme_enqueue_styles');

Sep 14

0

Woocommerce – Converting grams to kilograms ( product weights)

By louie171 | Web Design, Woocommerce, Wordpress | No Comments

If your using product weights in Woocommerce, you might find you want to change from grams to kilograms at some stage.

There are 2 parts to this:

Part 1:

Firstly in wp-admin you need to change a setting on the Woocommerce (below).

However this doesn’t automatically convert grams to kilograms.

Part 2:

Converting existing products grams to kilograms.

For this you’ll need to use a little script, I created this one as a page template.

<?php
/*
 *
 * Template name: list products
 */
get_header();
?>




<?php

$args = array( 'post_type' => 'product', 'posts_per_page' => 2500  );

$loop = new WP_Query( $args );

while ( $loop->have_posts() ) : $loop->the_post(); 
global $product; 



$weight= get_post_meta( get_the_ID(), '_weight', true);

if ( ! empty( $weight ) ) {
    
    echo "id = ".get_the_ID(). " wieght = ".$weight; 
    
    $new_weight = $weight / 1000 ; 
    
    echo "<br>new weight = ".$new_weight."  ********************";
    
    // id , key , value 
    $result = update_post_meta(get_the_ID(), '_weight', $new_weight);
    echo "result = ".$result;
    
    
}else{
    echo "<br>NO update for: ".get_the_ID();
}



endwhile; 


wp_reset_query(); 


?>




</div>

<?php get_footer(); ?>

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51

52

53

54

55

56

57

<?php

/*

*

* Template name: list products

*/

get_header();

?>

<?php

$args = array( 'post_type' => 'product', 'posts_per_page' => 2500 );

$loop = new WP_Query( $args );

while ( $loop->have_posts() ) : $loop->the_post();

global $product;

$weight= get_post_meta( get_the_ID(), '_weight', true);

if ( ! empty( $weight ) ) {

echo "id = ".get_the_ID(). " wieght = ".$weight;

$new_weight = $weight / 1000 ;

echo "<br>new weight = ".$new_weight." ********************";

// id , key , value

$result = update_post_meta(get_the_ID(), '_weight', $new_weight);

echo "result = ".$result;

}else{

echo "<br>NO update for: ".get_the_ID();

}

endwhile;

wp_reset_query();

?>

</div>

<?php get_footer(); ?>

Sep 07

0

How to speed up Woocommerce (and WordPress)

By louie171 | Business Growth, Ecommerce, Web Design, Woocommerce, Wordpress | 11 Comments

GTMetrix after I tuned up a client’s Woocommerce website

Speed tuning in WordPress and Woocommerce

This post contains details of how to supercharge your WordPress website.

Here are some speed tuning tips for getting your Woocommerce store loading quickly and keep customers on your site (slow loading = loss of customers).

Check file load times

In firebug look at the console requests (eg all the css/images etc, but especially important check for any php files like admin-ajax.php ). Any files that are taking a long time to load are slowing down the page for the user. It can be any type of file (but large uncompressed images are a common problem).

Look for any slow loading files:

A common one on woocommerce /?wc-ajax=get_refreshed_fragments often there is a plugin calling this (which causes a speed issue) – this may well be called by admin-ajax.php

https://woorkup.com/diagnose-admin-ajax-php-causing-slow-load-times-wordpress/

Minify, Combine and Compress

A great way to reduce the number of requests hitting the server is to combine your css and js files. Autoptimize will do this for you, just install and tick the relevant boxes on the settings page (it will also minify your html/css/js).

Run javascript when the page loads

By default javascript will load and run as soon as soon as the browser sees it ( this can slow things down drastically, if it takes awhile for the js to load ) . Most javascript can be run after the page loads, add defer or async to your javascripts to prevent js becoming a bottleneck in the page loading/rendering. If the js is loaded via wp_enqueue_script then you can use the Async Javascript plugin , if some script/s aren’t loaded with wp_enqueue_script you’ll need to add it manually to your scripts e.g.

<script defer src="path_to_your_script">

1	<script defer src="path_to_your_script">

I recently had this problem with a mailchimp script mc-validate.js , holding up the loading of a page by about 2 seconds, defered it and now it loads super quick.

Woocommerce cart tip

Many themes have the cart details drop down, by having a static link instead you can save on alot of Ajax calls to populate the cart ( if you have a busy store this can make a significant difference).

https://github.com/woothemes/woocommerce/issues/9365
add_action( 'wp_enqueue_scripts', 'dequeue_woocommerce_cart_fragments', 11); function dequeue_woocommerce_cart_fragments() { if (is_front_page()) wp_dequeue_script('wc-cart-fragments'); }

1 2	https://github.com/woothemes/woocommerce/issues/9365 add_action( 'wp_enqueue_scripts', 'dequeue_woocommerce_cart_fragments', 11); function dequeue_woocommerce_cart_fragments() { if (is_front_page()) wp_dequeue_script('wc-cart-fragments'); }

It says on homepage, but you can easy edit your theme slightly, to just have a static cart link ( not having that js running gives you a nice little speed boost).

From (first comment):

https://woocommerce.com/2016/03/woocommerce-speed-first-steps/

Check how many requests are being made

This is a follow on to the first step, the less files you need to load (the fewer requests), the faster the page load. Of course there’s a balance to struck here. Between functionality / design and speed. Use a tool like Chrome web developer tools or a website tool like GTMetrix to check how many requests are being made

Some plugins load lots of files, it might be a case of looking at some of them and checking if you really need them all. As baseline I try not to have more than 20 plugins (but again this is very subjective, some are big , some small etc …)

Disable wp-cron

By default this runs on every request to your website, if you have lots of requests this will drastically slow your website down.

Disable wp-cron default if you are getting lots of hits ( reconfig to only check a couple of times a day), see this article on how todo so.

php.ini

check the memory_limit allocated (this is the max memory any one request/process can take, so this is for each users http request).

A quick way to get a glance at php.ini info is make a file with this in <?php phpinfo(); ?>

These are probably among the most important values you will want to configure (the values will depend on your environment, how much traffic etc…):

post_max_size = 10M

1	post_max_size = 10M

upload_max_filesize = 10M

1	upload_max_filesize = 10M

memory_limit = 64M

1	memory_limit = 64M

max_execution_time = 300

1	max_execution_time = 300

There are various ways to configure that depend on your server setup, I’m an expert in this contact me if you would like help and I can give you a quote.

Check the usage stats

Use something like awstats to see stuff like how much bandwidth you using, and any files that are being called alot.

Check the logs

Is there anything that seems to be causing a problem ?

Check error_log in webroot if available (or standard apache error_log if not), or debug.log in /wp-content if thats available.

memory errors will look something like this:

PHP Fatal error:  Allowed memory size of 536870912 bytes exhausted (tried to allocate 72 bytes) in /home/mydomain/public_html/wp-includes/wp-db.php on line 2406

1	PHP Fatal error: Allowed memory size of 536870912 bytes exhausted (tried to allocate 72 bytes) in /home/mydomain/public_html/wp-includes/wp-db.php on line 2406

Database

You might need to optimise the database (always back up first!)

https://en-gb.wordpress.org/plugins/wp-optimize/

https://premium.wpmudev.org/blog/optimizing-your-wordpress-database-a-complete-guide/

Another thing you can look at to optimise your database is post revisions (they take up alot of space in the posts table, if you backup regularly do you really need them ?). This article tells you how to disable post revisions.

Database Problems with Woocommerce wp_options (especially true for Woocommerce 2.4 and before)

Woocommerce can be slowed down due to too many rows in the wp_options table, on a good host I’d advise keeping this under 10,000 rows as a max. On shared hosting you would probably want to halve that.

After all the above to speed up look at things like:

caching (there are many good caching plugins available)
image compression (smushit is a great plugin, smaller image sizes mean faster page loading times)
Look at using a CDN(content delivery network), this can take alot of load off your server and speed up the loading experience for your customers. Of the CDNs I’ve used Cloudflare is the best.

Web Design