Where’s the Windows 10 Control Panel?

Accessing the Control Panel in Windows 10 is one of those of course how obvious moments.

I found that the main control panel home page in Windows 10 was access by simply right clicking on the Windows logo at the bottom left hand corner of the screen.

Right click on the Windows logo to show a menu of admin related options.

Windows 10 open the control panel

The control panel is listed here amongst the other admin actions.

Where is the Windows 10 Services Control Panel?

In Windows 10 the Services control panel is to be found grouped on the Task Manager.

To access the services list begin by opening the Task Manager – right click on the Windows icon in the bottom left of the screen

Windows 10 open task manager

Clicking on Task Manager from this list opens the grouped Task Manager control panel.

Windows 10 task manager

Onto this panel has been grouped a number of the previously discrete individual views including the Services control panel.

Windows 10 task manager services

Click on the last tab to show the Services.

WooCommerce Configure Order Only no Payment

I wished to configure a WordPress e-commerce website using the popular WooCommerce plugin to take orders only, without taking payment.

I have previously used WooCommerce for product brochure management, hiding the prices to remove the shopping basket.

WooCommerce was to be used as a product brochure with an order created listing the product items and quantity.

Payment, order fulfillment and tracking would be made otherwise.

I considered the use of cash on delivery (cod) but found this neat snippet which is added in the functions.php file

add_filter('woocommerce_cart_needs_payment', '__return_false');

This allows the prices to be left in place.

An order is created in the usual way. At the end the order is completed and details emailed to the website owner, but no monetary transaction implemented.

I also removed all but cash on delivery (COD) from the payment gateways.

References

http://stackoverflow.com/questions/16729643/removing-payment-gateways-from-woocommerce

WooCommerce Change Words “Related Products”

By default WooCommerce uses the words “related product”, when showing the related products below a single product view.

I wished to change these words, supplementing the preferred text of my client.

Rather than editing the plugin directly which may subsequently be over-ridden on an update, I was looking to make the change either by the hooks and an entry in the file functions.php or by editing a copy of one of the template files.

Choosing to make the change by way of the template file, I copied the file related.php from

/wp-content/plugins/woocommerce/templates/single-product/related.php

to the child theme WooCommerce template directory

/wp-content/chlld-theme/woocommerce/single-product/related.php

Within the file look for:

<div class=”related products”><h2><?php _e(‘Related Products’, ‘woocommerce’); ?></h2>

Change the text between the <h2></h2> tags to your preferred text.

Periodically WooCommerce makes changes to the template files. An alert is shown on your WordPress admin if attention is required to your copied files. I have found it to be a simple task to review the differences between the new file and my website copy. If appropriate take a copy of the modified master template and re-implement your website specific changes.

Alternatively look to make the change in the language translation files

Looking in the translation file for WooCommerce, found at:

/wp-content/plugins/woocommerce/i18n/languages/woocommerce.pot

#: templates/single-product/rating.php:42
msgid "%s customer review"
msgid_plural "%s customer reviews"
msgstr[0] ""
msgstr[1] ""

#: templates/single-product/related.php:51
msgid "Related Products"
msgstr ""

#: templates/single-product/review-meta.php:28
msgid "Your comment is awaiting approval"
msgstr ""

To make your change put your updated text in the msgstr, between the empty speech marks. for example:

#: templates/single-product/related.php:51
msgid "Related Products"
msgstr "Similar products"

This can be readily changed. However, as before with making such changes, the next update of the plugin is likely to over-write your changes.

My view is that it’s easier to make changes to the templates file, and compare this with a future update version. The template file will also accept annotation, allowing the changes to be highlighted and described.

Scanning down through and amending a language file with a list of language relationships will be harder. Also easy to forget the purpose of the change in the language file.

Taking Screenshots on Windows 10

Taking a screenshot of the display on a computer can be a great way to convey the configuration settings or an error message.

Preparing the article Install IIS on Windows 10 I was interested in taking screenshots of my progress through the various screens.

I looked at using the pnt scr key.The choices associated with this option are more limited. Having taken the screenshot it requires a document to paste into. I wished to be able to do a simple save to a jpg file. Further, its a simple screen capture, rather than the capture of a selected window or a rectangular area of the window.

I chose to use the  Snipping tool.

To start this I began typing the word snipping in the search box at the bottom left of the screen until the word snipping was presented as an option.

Using the snipping tool I found it convenient to select the New>Window option. I was then able to select from the open windows and click on capture.

Having captured the window, with a trigger delay if it helps, I saved the file for use.

The saved file is of a quality and file size greater than will be required on a website. A smaller file size is downloaded quicker making the page load faster giving happier website visitors and better search engine results.

I used the Gimp to edit my images, reducing the saved image quality. If I had more images to adjust them a program such as XnConvert may have been more appropriate.

Screenshots on Windows 10 continue to support the use of the prt scr key.

Where does UpdraftPlus save its Backups?

Where does UpdraftPlus save the backup files, if none of the multitude of cloud storage offerings is used?

Not wishing to use an external storage location, such as Google Drive, Dropbox or Microsoft OneDrive. I configured UpdraftPlus to save the file locally, within the website space.

The question is “Where does UpdraftPlus save its backup files?

To understand this I logged into the control panel for the website domain and navigated through the file system.

I was lucky I looked within the wp-content directory first, where I found an updraft sub-directory.

PpdrafPplus backup file save directory

As the image above shows within the /wp-content/updraft directory are to be found the UpdraftPlus backups.

In case your website gets compromised you may wish to login occasionally to download these backups.

Better still use one of the external storage services to keep a backup of your website. Unfortunately these could also get deleted, so its still worth keeping a local backup copy.

 

 

 

Remove the Dotted Line Around a Clicked Link

When I click on a link a dotted line appears around it.

As an example, the image below is taken from some recent development work. It shows a menu in white on a dark background.

Remove dotted line around clicked link showing dots

Here I have clicked on the link to the contact us page. The white, dotted border line is showing until this page is replaced by the next.

As viewed I think that the dotted outline, when clicking on the link is not in keeping with the rest of the menu. I would like to remove it.

The image below shows how I would like the transition to look.

Remove dotted line around clicked link without dots

The expectation is that the configuration of the line border is configured in CSS.

In fact its controlled by the CSS outline property.

I added the property to the a entry in CSS, example:

a:hover, a:focus{color:#004;text-decoration:none;outline:none;}

Job done!

Now when I click on on the menu link there is no surrounding dotted line

 

Posted in CSS

Install IIS on Windows 10

For testing and development it’s convenient to install IIS on a Windows computer. In this case Windows 10.

IIS is installed through the Windows features control panel.

To access the Windows features, begin by opening the control panel by right clicking on the Windows logo. From the control panel home select the Programs and then Turn Windows features on and off.

Or if you prefer type the name of the control panel appwiz.cpl into the search box and press enter.

This will open the first stage, the Programs and features control panel.

Windows 10 install IIS programs and features

Click on Turn Windows features on or off in the left hand menu column. This will open a popup showing the list of features available.

Windows 10 install IIS Windows features

From the list select entries pertaining to IIS.

Windows 10 install IIS Windows features IIS options

You may wish to select the outer element allowing it to populate a typical set of options.

Once done click on OK at the bottom

Windows 10 install IIS Windows features applying changes

The new additions will be added.

Windows 10 install IIS Windows features changes completed

Until all is installed.

Checkout your installation of IIS by navigating to http://localhost.

Windows10 install IIS localhost confirmation

 

Adding a New Product to a WooCommerce shop/catalogue

1. Introduction

WooCommerce is a highly customisable shop/cataloguing plug-in.  Details on usage are provided directly via the following references

https://docs.woocommerce.com/document/managing-products/

https://docs.woocommerce.com/document/variable-product/

https://docs.woocommerce.com/document/related-products-up-sells-and-cross-sells/

https://docs.woocommerce.com/document/linking-a-project-to-a-product/

The text below is an overview which may be helpful, however if in doubt, refer to the official WooCommerce documentation

Having logged into your WooCommerce enabled WordPress CMS site the Woocommerce features/options are found in the left hand menu.

  • The WooCommerce menu item covers overall configuration and available options.
  • The Products menu item covers the shop/catalogue content.

To add or edit the products, select Products to expand the available options, followed by the Add Products menu item.

WooCommerce add new product menu add product

  • select Products to see a list of all products currently loaded into the shop/catalogue
  • select Add Product to add an individual product to the shop/catalogue will be listed.
    • note:  WooCommerce does not include bulk import by default, however import plugins are available to  enable bulk import from csv.

2. Navigating the Add Product menu item

Having selected add product you are presented with a number of fields to add product information.

WooCommerce add new product: Add new product page view

  1. Content Area: This is the main content for the product description
  2. Hover over a product to show the possible actions: edit, quick edit and view

edit: takes you to the details page for the selected product, enabling you to update product details as required.

quick edit: takes you to a subset of fields such as price, product category, product availability to enable fast management of the list of products

view: provides a preview of how the product is listed in your shop/catalogue.

3. Adding a new Product

To add a new product either click on Add Product shown at the top of the image above, or click on Add Product from the menu. You are presented with a number of field options and menus:

  1. Product Data type drop down menu: enables the product to be defined as Simple, Grouped or Variable
    • Simple Product: a self contained, single item,
    • Grouped Product: whereby the individual product is detailed, but will be sold as part of a defined group.
    • Variable Product: enables a product to be defined with variations; for example a t-shirt having different colours, or shoes with different sizes.  The product data for a variable product will automatically become the umbrella data for 2 or more additional products – the variants. Selecting Variable product automatically adds a new tab “Variations”. The screen shot below shows the options available for variations – for example product colour.
      To add the variation product, select the attributes tag, adding your variations (for example different colours), then visit the variations tab to select the colour and add the variation, giving the colour variation a unique sku:WooCommerce add new product: variable product variations
  2. Product Data management tabs menu: enables product information to be added under a fixed set of categories:  General, Inventory, Shipping, details on Linked Products and Attributes (specific product details).
    • General: set the price which you will charge for the product.WooCommerce add new product: general
    • Inventory: Add a SKU (Stock Keeping Unit) reference entry to uniquely identify your product. The Stock Status entry may be used to indicate stock level, from  “in stock” to an actual number, using the Manage Stock option.
    • WooCommerce add new product: inventory
    • shipping: Package size for shipping. Leave alone unless you wish to define the shipping box of the product.
    • WooCommerce add new product: shipping
    • Linked Products:  Linked products allow other products to be shown according to the selected item – perhaps similar items or “often bought with” items.  Linked products works in 3 ways:
      • Up-sells – enabling a more expensive product to be highlighted as an alternative to the selected product.  To add up-sell products:
        • create your product as a simple product
        • then create a new product which will incorporate these
        • under product data select simple product and the linked products tab, add products into up-sells
      • Cross-sells – a chance to sell an additional product. Bought a phone – why not add a case?
      • Grouping – set this to group the product with other items.
    • WooCommerce add new product: linked prodcts
    • Attributes:  An option to define additional custom properties.  If you specialise in a particular range of products then additional details may be appropriate. For example a painting may warrant water colour, oils, width /height and canvas.
    • WooCommerce add new product: attributes
    • Advanced: Additional options to enable a note to be sent to the customer with the purchase, to set the menu order and to enable customers to review products.

WooCommerce add new product: advanced

3. Generic product details

Accessed from the right hand panel, the generic product details are important to categorise and display your product information in the shop/catalogue

Product Categories: Enable you to associate your product with a particular category(ies).  These categories are used when displaying products.

Product Tags: A way to add an extra level of categorisation. Tags can be a great way of promoting products/website pages.

Product Image: A single large image is shown to represent the product. The image is uploaded in the usual way, either my selecting from the media images already in the library or by adding a new image from the local computer.

Product Gallery: If you wish to show more than one image then add more here.

Product Short Description: Does what it says, provides a short summary description about the product on list pages. Shown prior to clicking through to the full product details.

END

Link your Twitter Android app to your Twitter Account

Create a Twitter application to link your Android Twitter app with your Twitter account, enabling the posting of tweets from your Android phone or tablet.

Most of the Android Twitter apps make use of their own Twitter application by default.

Whilst this makes the configuration of the app easy, Twitter imposes a limit on the number of clients using a given application. A number of these clients have previously reached their client limit.

With your own Twitter application you are not reliant upon the configuration and maintenance of details by someone else.

Also the security keys which you use are unique to your application – much safer. And as many of the Twitter Android apps are at, or near the limit imposed by Twitter using your app allows someone else to make use of the default.

Create your own Twitter application, linking your Twitter Android app. Its easy to do and avoids any potential issues from using the default application associated with one of the Android apps.

The Twitter application provides two encrypted keys to enter in the Twitter app.

In this example I used Twidere, of coarse other apps are available.

In the Twidere app slide in from the left edge of the screen to show the configuration options.

From the settings select network, then scroll down to select default API settings.

On this page it is the consumer key and consumer secret which we shall be entering from our Twitter application.

twitter-auth-twidere

Rather than the usual Twitter public website, we’ll start from is the development website dev.twitter.com

At the top of the page click on my apps in the navigation at the top. This goes to https://apps.twitter.com/. No doubt you have a Twitter account – sign in with the details..

Create Twitter Application: Login

After logging in the shown page has a list of your existing Twitter apps.

create-twitter-app-list

Click on Create New App button

create-twitter-app-create

Enter the relevant details. It’s worth describing your app properly in the description, in case you wonder what it is in 6 months time. Ensure that your website link contains the full reference, including the http://

create-twitter-app-details

Select the tab for Keys and Access tokens

create-twitter-app-keys

The consumer key and consumer secret values and shown.

Create Twitter application: Keys and Access Token

Whilst not needed at the moment I often create the access tokens at this time. Click on the button Create my access token to populate the values of the token and token secret.

Copy the application setting values of consumer key (API key) and  consumer secret (API secret) into the Twitter Android app. In our example we are using Twidere. Click OK to save.

Create Twitter Application: Twidere Android Client API Authorisation Settings

Your Android Twitter client app should now be good to go. Return to the list of tweets and try adding a new one.