showi

<p>This plugin collect data attached to post/article via <strong>custom field</strong> and make<br />
chart of it.<br />
This plugin use <strong>Chart.js</strong> for chart drawing <a href="http://www.chartjs.org/" rel="nofollow ugc">ChartJs</a></p>
<p>Data are collected by looking for specific <em>custom field</em> attached to your<br />
post/page. You can change aggregation method, intervall…</p>
<p>See <a href="https://wordpress.org/plugins/wp-custom-field-chart/other_notes/" rel="ugc">usage</a></p>
<h3>Usage</h3>
<p>Edit your post/page in text mode and put some Javascript and a WordPress tag</p>
<h4>Minimum</h4>
<pre><code><script>
var mydata = { datasets: [{}]};
</script>
[custom_field_chart fields="humidity" js_data="mydata"]
</code></pre>
<p>For each field you need to put empty {} into datasets.</p>
<p>For two fields:</p>
<pre><code><script>
var mydata = {datasets: [{},{}]}
</script>
[custom_field_chart fields="humidity,temperature" js_data="mydata"]
</code></pre>
<p>But it’s pretty useless to put more than one field without different colors 🙂</p>
<h4>More</h4>
<pre><code><script>
var mydata = {
    datasets: [
        {
            label: "Humidity",
            fillColor: "rgba(255,73,0,1)",
            strokeColor: "rgba(255,73,0,1)",
            pointColor: "rgba(255,73,0,1)",
            pointStrokeColor: "#fff",
            pointHighlightFill: "#fff",
            pointHighlightStroke: "rgba(220,220,220,1)",
        },
        {
            label: "Temperature",
            fillColor: "rgba(255,73,0,1)",
            strokeColor: "rgba(255,73,0,1)",
            pointColor: "rgba(255,73,0,1)",
            pointStrokeColor: "#fff",
            pointHighlightFill: "#fff",
            pointHighlightStroke: "rgba(220,220,220,1)",
        },
    ]
};

var myopts = {
    pointDotRadius: 1,
    bezierCurveTension: 0.2,
    barStrokeWidth : 2,
    barValueSpacing : 2,
    barDatasetSpacing : 0,
};

// Optional...
jQuery(window).load(function() {
    Chart.defaults.global.responsive = true;
    Chart.defaults.global.animationEasing = "easeOutBounce";
    Chart.defaults.global.onAnimationComplete = function(){
        alert('Hello');
    }
});
// End optional
</script>

[custom_field_chart width="1000" height="300"
  kind="line" method="track" interval="day" interval_count="31" 
  fields="humidity,temperature" js_data="mydata" js_options="myopts"]
</code></pre>
<h4>Notes</h4>
<ol>
<li>js_data and js_options must reflect name given to your javascript variable.</li>
<li>Look at http://chartjs.org/ for documentation</li>
<li>You don’t need to supply labels and data (like in chartjs.org example) 🙂</li>
</ol>
<h3>Tag attributes</h3>
<p>= Required =<br />
1. <em>fields</em>: Custom field separate by comma<br />
1. <em>js_data</em>: Name of javascript variable holding chart datasets</p>
<h4>Optional</h4>
<ol>
<li><em>width</em>: Chart width (default: 400)</li>
<li><em>height</em>: Chart Height (default: 200)</li>
<li><em>method</em>: Aggregate method track, delta or cumulative (defaul: track)</li>
<li><em>interval</em>: year, month, day (default: day)</li>
<li><em>interval_count</em>: How many year, mont or day (default: 31)</li>
<li><em>js_options</em>: Name of javascript variable holding chart options</li>
<li><em>kind</em>: Chart type line or bar (default: line)</li>
<li><em>to_date</em>: Current date by default, post date if ‘post’ specified else value supplied </li>
<li><em>dump</em>: Dumping attributes for debug (default: False)</li>
<li><em>round</em>: Rounding data with specified precision</li>
</ol>
<h3>Note</h3>
<p>Beta software… Interface may change.</p>


Wp Custom Field Chart

Make chart from custom field attached to your post/page using Chart.js javascript library.

Hiroaki Miyashita

<p>The Custom Field Template plugin adds the default custom fields on the Write Post/Page. The template format is almost same as the one of the rc:custom_field_gui plugin. The difference is following.</p>
<ul>
<li><a href="https://www.wpcft.com/" rel="nofollow ugc">English Custom Field Template Manual</a></li>
</ul>
<p>We have finally published a manual site for the custom field template plugin. You can also use the custom field refinement search for posts in the admin panel. Please check here.</p>
<ul>
<li>You can set any number of the custom field templates and switch the templates when you write/edit the post/page.</li>
<li>This plugin does not use the ini file for the template but set it in the option page of the plugin.</li>
<li>Support for TinyMCE in the textarea.</li>
<li>Support for media buttons in the textarea. – requires at least 2.5.</li>
<li>Support for multiple fields with the same key.</li>
<li>Support for hideKey and label options.</li>
<li>You can see the full option list in the setting page of the plugin.</li>
<li>You can customize the design of custom field template with css.</li>
<li>You can replace custom keys by labels.</li>
<li>You can use wpautop function.</li>
<li>You can use PHP codes in order to set values. (experimental, <code>code = 0</code>)</li>
<li>You can set an access user level in each field. (<code>level = 1</code>)</li>
<li>Supprt for inserting custom field values into tags automatically. (<code>insertTag = true</code>)</li>
<li>Adds [cft] Shortcode to display the custom field template. (only shows the attributes which have <code>output = true</code>)</li>
<li>Adds template instruction sections.</li>
<li>Adds the value label option for the case that values are diffrent from viewed values. (<code>valueLabel = apples # oranges # bananas</code>)</li>
<li>Adds the blank option. (<code>blank = true</code>)</li>
<li>Adds the break type. Set CSS of ‘#cft div’. (<code>type = break</code>)</li>
<li>Adds [cft] Shortcode Format.</li>
<li>Adds the sort option. (<code>sort = asc</code>, <code>sort = desc</code>, <code>sort = order</code>)</li>
<li>Support for Quick Edit of custom fields. (tinyMCE and mediaButton are not supported yet)</li>
<li>Support for the custom field search. (only shows the attributes which have <code>search = true</code>.)</li>
<li>Adds [cftsearch] Shortcode Format. (under development)</li>
<li>Adds PHP codes for the output value. (<code>outputCode = 0</code>)</li>
<li>Adds PHP codes before saving the values. (<code>editCode = 0</code>)</li>
<li>Adds the save functionality.</li>
<li>Adds the class option. (<code>class = text</code>)</li>
<li>Adds the auto hook of <code>the_content()</code>. (experimental)</li>
<li>You can use the HTML Editor in the textarea. (<code>htmlEditor = true</code>)</li>
<li>Adds the box title replacement option.</li>
<li>Adds the select option of the post type.</li>
<li>Adds the value count option.</li>
<li>Adds the option to use the shortcode in the widhet.</li>
<li>Adds the attributes of JavaScript Event Handlers. (<code>onclick = alert('ok');</code>)</li>
<li>Adds the Initialize button.</li>
<li>Adds the attributes of before and after text. (<code>before = blah</code>, <code>after = blah</code>)</li>
<li>Adds the export and import functionality.</li>
<li>Adds the style attribute. (<code>style = color:#FF0000;</code>)</li>
<li>Adds the maxlength attribute. (<code>maxlength = 10</code>)</li>
<li>Adds the attributes of multiple fields. (<code>multiple = true</code>, <code>startNum = 5</code>, <code>endNum = 10</code>, <code>multipleButton = true</code>)</li>
<li>Adds the attributes of the date picker in <code>text</code> type. (<code>date = true</code>, <code>dateFirstDayOfWeek = 0</code>, <code>dateFormat = yyyy/mm/dd</code>)</li>
<li>Adds the filter of page template file names (Thanks, Joel Pittet).</li>
<li>Adds the attribute of <code>shortCode</code> in order to output the shortcode filtered values. (<code>shortCode = true</code>)</li>
<li>Adds the attribute of <code>outputNone</code> in case there is no data to output. (<code>outputNone = No Data</code>)</li>
<li>Adds the attribute of <code>singleList</code> attribute in order to output with <code><ul><li></code> if the value is single. ex) <code>singleList = true</code></li>
<li>Adds the file upload type. (<code>type = file</code>)</li>
<li>Adds the fieldset type. (<code>type = fieldset_open</code>, <code>type = fieldset_close</code>)</li>
<li>Adds the option to deploy the box in each template.</li>
</ul>
<p>Localization</p>
<ul>
<li>Belorussian (by_BY) – <a href="http://www.fatcow.com/" rel="nofollow ugc">Marcis Gasuns</a></li>
<li>Catalan (ca) – <a href="http://andreullos.com/" rel="nofollow ugc">Andreu Llos</a></li>
<li>Czech (cs_CZ) – <a href="http://www.webees.cz/" rel="nofollow ugc">Jakub</a></li>
<li>German (de_DE) – F J Kaiser</li>
<li>Spanish (es_ES) – <a href="http://www.darioferrer.com/" rel="nofollow ugc">Dario Ferrer</a></li>
<li>Farsi (fa_IR) – <a href="http://sabood.ir/" rel="nofollow ugc">Mehdi Zare</a></li>
<li>French (fr_FR) – Nicolas Lemoine</li>
<li>Hungarian (hu_HU) – <a href="http://www.netpok.hu" rel="nofollow ugc">Balazs Kovacs</a></li>
<li>Indonesian (id_ID) – <a href="http://www.openscriptsolution.com/" rel="nofollow ugc">Masino Sinaga</a></li>
<li>Italian (it_IT) – <a href="http://gidibao.net/" rel="nofollow ugc">Gianni Diurno</a></li>
<li>Japanese (ja) – <a href="https://wpgogo.com/" rel="nofollow ugc">Hiroaki Miyashita</a></li>
<li>Dutch (nl_NL) – <a href="http://wordpresswebshop.com/" rel="nofollow ugc">Rene</a></li>
<li>Polish (pl_PL) – <a href="http://www.difreo.pl/" rel="nofollow ugc">Difreo</a></li>
<li>Brazilian Portuguese (pt_BR) – <a href="http://www.gn10.com.br/" rel="nofollow ugc">Caciano Gabriel</a></li>
<li>Russian (ru_RU) – <a href="http://www.sonika.ru/blog/" rel="nofollow ugc">Sonika</a></li>
<li>Swedish (sv_SE) – <a href="http://www.fristil.se/" rel="nofollow ugc">Pontus Carlsson</a></li>
<li>Turkish (tr_TR) – <a href="http://ramerta.com/" rel="nofollow ugc">Omer Faruk</a></li>
<li>Ukranian (uk_UA) – <a href="http://www.portablecomponentsforall.com" rel="nofollow ugc">Andrew Kovalev</a></li>
<li>Uzbek (uz_UZ) – <a href="http://www.comfi.com/" rel="nofollow ugc">Alexandra Bolshova</a></li>
<li>Chinese (zh_CN) – hurri zhu</li>
</ul>
<p>If you have translated into your language, please let me know.</p>
<ul>
<li><a href="http://ja.wpcft.com/" rel="nofollow ugc">Japanese Custom Field Template Manual</a></li>
</ul>
<p>Are you interested in other plugins? See the following site <a href="https://www.cmswp.jp/" rel="nofollow ugc">CMS x WP</a>.</p>
<h3>Known Issues / Bugs</h3>
<h3>Uninstall</h3>
<ol>
<li>Deactivate the plugin</li>
<li>That’s it! 🙂</li>
</ol>


Custom Field Template

The Custom Field Template plugin extends the functionality of custom fields.

Wp Custom Field Chart vs Custom Field Template