{"id":1512,"date":"2017-08-29T22:25:49","date_gmt":"2017-08-29T17:25:49","guid":{"rendered":"https:\/\/thedevcouple.com\/?p=1512"},"modified":"2017-09-28T15:07:39","modified_gmt":"2017-09-28T10:07:39","slug":"wpautopot-can-help-auto-generate-wordpress-pot-i18n-l10n","status":"publish","type":"post","link":"https:\/\/thedevcouple.com\/wpautopot-can-help-auto-generate-wordpress-pot-i18n-l10n\/","title":{"rendered":"WPAutoPot Can Help You Auto Generate WordPress .POT for I18n &#038; L10n"},"content":{"rendered":"<h2>\ud83d\ude80 <a href=\"https:\/\/github.com\/ahmadawais\/WPAutoPot\/\" rel=\"nofollow noopener\" target=\"_blank\">GITHUB: \u2605 32 \u2442 2 \u2192<\/a><\/h2>\n<div class=\"eckosc eckosc_full_width_block\"><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-large wp-image-1513\" src=\"https:\/\/thedevcouple.com\/wp-content\/uploads\/2017\/08\/WPAutoPot-large-1024x576.png\" alt=\"WPAutoPot\" width=\"1024\" height=\"576\" srcset=\"https:\/\/thedevcouple.com\/wp-content\/uploads\/2017\/08\/WPAutoPot-large-1024x576.png 1024w, https:\/\/thedevcouple.com\/wp-content\/uploads\/2017\/08\/WPAutoPot-large-300x169.png 300w, https:\/\/thedevcouple.com\/wp-content\/uploads\/2017\/08\/WPAutoPot-large-768x432.png 768w, https:\/\/thedevcouple.com\/wp-content\/uploads\/2017\/08\/WPAutoPot-large.png 1920w, https:\/\/thedevcouple.com\/wp-content\/uploads\/2017\/08\/WPAutoPot-large-1680x945.png 1680w, https:\/\/thedevcouple.com\/wp-content\/uploads\/2017\/08\/WPAutoPot-large-1240x698.png 1240w, https:\/\/thedevcouple.com\/wp-content\/uploads\/2017\/08\/WPAutoPot-large-860x484.png 860w, https:\/\/thedevcouple.com\/wp-content\/uploads\/2017\/08\/WPAutoPot-large-680x383.png 680w, https:\/\/thedevcouple.com\/wp-content\/uploads\/2017\/08\/WPAutoPot-large-500x281.png 500w, https:\/\/thedevcouple.com\/wp-content\/uploads\/2017\/08\/WPAutoPot-large-400x225.png 400w, https:\/\/thedevcouple.com\/wp-content\/uploads\/2017\/08\/WPAutoPot-large-200x113.png 200w, https:\/\/thedevcouple.com\/wp-content\/uploads\/2017\/08\/WPAutoPot-large-50x28.png 50w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/div>\n<table width=\"100%\">\n    <tr>\n        <td align=\"left\" width=\"100%\" colspan=\"2\">\n            <strong>WPAutoPot<\/strong><br \/>\n            Auto Generate WordPress .POT (Portable Objects Template) files via NPM Scripts or Gulp.\n        <\/td>\n    <\/tr>\n    <tr>\n        <td>\n            A FOSS (Free & Open Source Software) project. Maintained by <a href=\"https:\/\/github.com\/ahmadawais\" rel=\"nofollow noopener\" target=\"_blank\">@AhmadAwais<\/a>.\n        <\/td>\n        <td align=\"center\">\n            <a href=\"https:\/\/AhmadAwais.com\/\" rel=\"nofollow noopener\" target=\"_blank\">\n                <img src=\"https:\/\/i.imgur.com\/Asg4d3k.png\" width=\"100\" alt=\"\">\n            <\/a>\n        <\/td>\n    <\/tr>\n<\/table>\n<p>Auto Generate WordPress .POT (Portable Objects Template) files via NPM Scripts or Gulp.<\/p>\n<p><img src=\"https:\/\/i.imgur.com\/WmVaebP.png\" alt=\"WPAutoPot\" \/><\/p>\n\n<p>Make sure you have node installed. If not <a href=\"https:\/\/nodejs.org\/en\/download\/\" rel=\"nofollow noopener\" target=\"_blank\">download and install node<\/a>.<\/p>\n<h2>\u2192 STEP #1: Install NodeJS &amp; NPM<\/h2>\n<p>After installing NodeJS you can verify the install of both NodeJS and Node Package Manager by typing the following commands. This step needs to be followed only once i.e. if you don't have NodeJS installed. No need to repeat it ever again.<\/p>\n<pre><code class=\"language-bash\">node -v\n# v7.10.0\n\nnpm -v\n# 4.2.0<\/code><\/pre>\n<h2>\u2192 Step #2. Download <code>package.json<\/code><\/h2>\n<p>Download <a href=\"https:\/\/git.io\/WPAutoPotFile\" rel=\"nofollow noopener\" target=\"_blank\"><code>package.json<\/code><\/a> file inside the root folder of your WordPress plugin or WordPress theme\nIf you have cURL installed then you can run the following command to download it in one go (just make sure you open the root folder of your WordPress plugin or WordPress theme and download <a href=\"https:\/\/git.io\/WPAutoPotFile\" rel=\"nofollow noopener\" target=\"_blank\"><code>package.json<\/code><\/a> file in it).<\/p>\n<pre><code class=\"language-bash\">curl -L 'https:\/\/git.io\/WPAutoPot' -o package.json<\/code><\/pre>\n<h2>\u2192 STEP #3: Configure NPM Scripts &amp; Install WP-POT-CLI<\/h2>\n<p>Now, if you want to use NPM Scripts then you need to do the following:<\/p>\n<ul>\n<li><strong>Install<\/strong> the WP POT CLI \u2014 just run <code>npm install --global wp-pot-cli<\/code> in your terminal.<\/li>\n<li><strong>Configure<\/strong> the NPM script called pot \u2014 If you open the <a href=\"https:\/\/git.io\/WPAutoPotFile\" rel=\"nofollow noopener\" target=\"_blank\"><code>package.json<\/code><\/a> file you can find it under <code>scripts<\/code>.<\/li>\n<\/ul>\n<pre><code class=\"language-json\">\"scripts\": {\n    \"pot\": \"wp-pot --src '**\/*.php' --dest-file 'languages\/WPAutoPot.pot' --package 'WPAutoPot' --domain 'WPAutoPot' --last-translator 'Ahmad Awais &lt;your_email@email.com&gt;' --team 'Team &lt;team@example.com&gt;' --bug-report 'https:\/\/your-domain.com\/contact'\"\n}<\/code><\/pre>\n<p>In the <code>pot<\/code> script, you need to change<\/p>\n<ul>\n<li>--src '*<em>\/<\/em>.php'  (Source files)<\/li>\n<li>--dest-file 'languages\/WPAutoPot.pot' (Destination file)<\/li>\n<li>--package 'WPAutoPot' (Package name)<\/li>\n<li>--domain 'WPAutoPot' (Domain to retrieve the translated text)<\/li>\n<li>--last-translator 'Ahmad Awais <a href=\"mailto:your_email@email.com\">your_email@email.com<\/a>' (Name and email address of the last translator E.g. John Doe <a href=\"mailto:me@example.com\">me@example.com<\/a>)<\/li>\n<li>--team 'Team <a href=\"mailto:team@example.com\">team@example.com<\/a>' (Name and email address of the translation team E.g. Team <a href=\"mailto:team@example.com\">team@example.com<\/a>)<\/li>\n<li>--bug-report '<a href=\"https:\/\/your-domain.com\/contact\" rel=\"nofollow noopener\" target=\"_blank\">https:\/\/your-domain.com\/contact<\/a>' (Header with URL for reporting translation bugs)<\/li>\n<\/ul>\n<blockquote>\n<p>NOTE: That currently this little WP plugin has following file structure<\/p>\n<pre><code class=\"language-bash\">\u251c\u2500\u2500 languages\n|  \u2514\u2500\u2500 WPAutoPot.pot\n\u251c\u2500\u2500 package.json\n\u251c\u2500\u2500 gulpfile.js\n\u2514\u2500\u2500 plugin.php<\/code><\/pre>\n<\/blockquote>\n<h2>\u2192 STEP #4: Run NPM Scripts<\/h2>\n<p>All that's left now is for you to run the NPM script in the root folder of your WP project \u2014 where you downloaded the <a href=\"https:\/\/git.io\/WPAutoPotFile\" rel=\"nofollow noopener\" target=\"_blank\"><code>package.json<\/code><\/a> file.<\/p>\n<blockquote>\n<p>NOTE: Before you run, make sure there is a <code>languages<\/code> directory. Otherwise running the script will display an error.<\/p>\n<\/blockquote>\n<pre><code class=\"language-bash\"># Compile POT file.\nnpm run pot<\/code><\/pre>\n<!-- ![Run](https:\/\/i.imgur.com\/tIelJwy.gif) -->\n<h2>\u2192 STEP #5: Compile via Gulp \u2014 Installing Node Dependencies<\/h2>\n<p>If you want to use Gulp to compile the pot files. then follow the following steps otherwise jump to the last step. <\/p>\n<p>We are in the root folder of our WordPress plugin or WordPress theme at the moment, let's install the Node Dependencies. In the terminal run this command and wait for it to download all the NodeJS dependencies. It's a one time process and can take about a minute depending on the internet speed of your connection.<\/p>\n<pre><code class=\"language-bash\"># For MAC OS X run the following command with super user\nsudo npm install\n\n# For Linux run the following command\nnpm install<\/code><\/pre>\n<h2>\u2192 STEP #6: Download, Configure &amp; Run Gulp<\/h2>\n<p>First of all, download the <a href=\"https:\/\/git.io\/WPAutoPotGulpFile\" rel=\"nofollow noopener\" target=\"_blank\"><code>gulpfile.js<\/code><\/a> file in the root folder .<\/p>\n<pre><code class=\"language-bash\">curl -L 'https:\/\/git.io\/WPAutoPotGulp' -o gulpfile.js<\/code><\/pre>\n<p>Now that you have <a href=\"https:\/\/git.io\/WPAutoPotGulpFile#L18-L32\" rel=\"nofollow noopener\" target=\"_blank\"><code>gulpfile.js<\/code><\/a> downloaded in the root, you can open it up and configure the info at the top where it says <code>\/\/\u2014 START Editing Project Variables. \u2014\/\/.<\/code> till it says <code>\/\/\u2014 STOP Editing Project Variables. \u2014\/\/.<\/code> (<a href=\"https:\/\/git.io\/WPAutoPotGulpFile#L18-L32\" rel=\"nofollow noopener\" target=\"_blank\">these lines<\/a>)These are the similar project variables described in the Step #3.<\/p>\n<p>All you have to do now is run <code>gulp<\/code> in your command line terminal and your translated POT file will get generated.<\/p>\n<pre><code class=\"language-bash\"># Run gulp to compile .pot file.\ngulp<\/code><\/pre>\n<p><img src=\"https:\/\/i.imgur.com\/wYKBZLp.gif\" alt=\"GIF\" \/><\/p>\n<h2>\u2192 STEP #7: Share!<\/h2>\n<p>Yup, there are no more steps. Just share it with your friends. Or <a href=\"https:\/\/twitter.com\/home?status=%F0%9F%94%A5%20WPAutoPot%3A%20Awesome%20pkg%20by%20%40MrAhmadAwais%20to%20auto%20generate%20pot%20files%20for%20i18n%20%26%20l10n%20in%20%23WordPress%20%E2%80%94%20star%20it%20%E2%86%92%20ahmda.ws\/WPAutoPot\" rel=\"nofollow noopener\" target=\"_blank\">Click to Tweet about it<\/a>.<\/p>\n<h2>Contribute<\/h2>\n<p>Feel free to contribute. PR's are welcomed.<\/p>\n<h2>Changelog<\/h2>\n<h3>Version 1.0.0<\/h3>\n<ul>\n<li>First version<\/li>\n<li>Compile: POT files via NPM Scripts<\/li>\n<li>Compile: POT files via Gulp<\/li>\n<\/ul>\n<h2>License<\/h2>\n<p>Released under MIT License.\nCopyright <a href=\"https:\/\/AhmadAwais.com\/\" rel=\"nofollow noopener\" target=\"_blank\">Ahmad Awais<\/a><\/p>\n<p>It&#8217;s free and open source. Issues\/PR&#8217;s are welcomed on GitHub.<\/p>\n<h2>\ud83d\ude80 <a href=\"https:\/\/github.com\/ahmadawais\/WPAutoPot\/\" rel=\"nofollow noopener\" target=\"_blank\">GITHUB: \u2605 32 \u2442 2 \u2192<\/a><\/h2>\n<p>Let me know what you think about this \ud83d\ude42<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Auto Generate WordPress .POT (Portable Objects Template) files via NPM Scripts or Gulp.<\/p>\n","protected":false},"author":3,"featured_media":1513,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":""},"categories":[6],"tags":[],"coauthors":[],"jetpack_featured_media_url":"https:\/\/thedevcouple.com\/wp-content\/uploads\/2017\/08\/WPAutoPot-large.png","amp_enabled":true,"_links":{"self":[{"href":"https:\/\/thedevcouple.com\/api\/wp\/v2\/posts\/1512"}],"collection":[{"href":"https:\/\/thedevcouple.com\/api\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/thedevcouple.com\/api\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/thedevcouple.com\/api\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/thedevcouple.com\/api\/wp\/v2\/comments?post=1512"}],"version-history":[{"count":0,"href":"https:\/\/thedevcouple.com\/api\/wp\/v2\/posts\/1512\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/thedevcouple.com\/api\/wp\/v2\/media\/1513"}],"wp:attachment":[{"href":"https:\/\/thedevcouple.com\/api\/wp\/v2\/media?parent=1512"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/thedevcouple.com\/api\/wp\/v2\/categories?post=1512"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/thedevcouple.com\/api\/wp\/v2\/tags?post=1512"},{"taxonomy":"author","embeddable":true,"href":"https:\/\/thedevcouple.com\/api\/wp\/v2\/coauthors?post=1512"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}