Web Design

WordPress – Link a una Categoria

Wordpress – Link a una Categoria

Una categoria intera di articoli può essere richiamata facilmente con un link HTML – a href –

Supponiamo di avere una categoria ‘sponsor’ con ID= 12

1. Creiamo una nuova pagina dalla schermata di Admin di WP:
wp-admin> Pages> Add New

2. Attiviamo il tab ‘Text’ perchè vogliamo scrivere direttamente con la sintassi HTML e acriviamo:

<a href="http://www.lucedigitale.com/blog/?cat=12" title="">Richiama tutta la categoria con ID 3</a>

NOTARE:

http://www.lucedigitale.com/blog/?cat=12

Per ricavare questo link posso utilizzare 3 metodi:

ONE

1. dalla schermata di Admin di WP:
wp-admin> Appeareance> Widgets> Categories, inserire il Widget Categories nel nostro blog

2. Aprire il blog, posizionarsi su una delle voci generata dal Widget Categories, RMB> Copia Indirizzo Link

TWO

1. dalla schermata di Admin di WP:
wp-admin> Posts> Categories> posizionare il cursore del mouse sopra una categoria, RMB> Copia Indirizzo Link

2. il codice copiato sarà:

http://www.lucedigitale.com/blog/wp-admin/edit-tags.php?action=edit&taxonomy=category&tag_ID=12&post_type=post

Il codice sarà 12, notare la porzione di codice:

ID=12

THREE

1. Aprire dal CPanel> PhpMyAdmin> Data Base di WordPress> tabella wp_terms
2. Individuare la colonna ‘name’ – individuare il corrispondente valore della colonna ‘term_id’ che sarà 12

wp-categorie-creare-link

By |WordPress|Commenti disabilitati su WordPress – Link a una Categoria
Read More

Unity – Scripting – Debug

Videogames Development – Unity – Debug.Log

Logs message to the Unity Console.

Statements:

// Message with a link to an object.
Debug.Log ("Hello", gameObject);

// Message using rich text.
Debug.Log("<color=red>Fatal error:</color> AssetBundle not found");

SCRIPT

MAIN TOP MENU> ASSETS> CREATE> Javascript, type the name ‘GetMousePosition’

Assets> GetMousePosition> Inspector> ‘Open…’ button

Write:

#pragma strict

function Start () {

}

function Update () {
	var mouse = Input.mousePosition;
        Debug.Log(mouse);
		
	}

Create an Object inside the Hierarchy ‘MyObject’

Assets> DRAG AND DROP ‘GetMousePosition’ script over Hierarchy> MyObject

Play> move the mouse, look at the BOTTOM OF THE SCREEN, you will see the coordinates as: (536.0, 583.0, 0.0)

By |JavaScript, Unity3D, Video Games Development|Commenti disabilitati su Unity – Scripting – Debug
Read More

Luce Digitale/JQ Sunny Rich Text Editor – Basic

Luce Digitale/JQ Sunny Rich Text Editor – Basic

DEMO

 

Rich-text editor is web component that allow users to edit and enter text within a web browser.
Rich-text editor is web-based, WYSIWYG (“what you see is what you get”) editor.
With this tool in your website, your clients can add rich text content without programming knowledge.
This tool I coded is free.
If you use it in your website, I will you be glad if you will add a returning link to http://blog.lucedigitale.com
Thanks in advance :)

<!DOCTYPE html>
<html>
<!-- Luce Digitale/JQ Sunny Rich Text Editor                                                 -->
<!-- Author: Andrea Tonin - http://blog.lucedigitale.com                                     -->
<!-- This code come with absolutely no warranty                                              -->
<!-- If you use this code in your project please give a link to http://blog.lucedigitale.com -->
<!-- Thanks in advance                                                                       -->
<head>

<style>
/* Input Box Style */
#sunnyrte {
width:100%;
height:200px;
border: 1px solid #c0c0c0;
}
/* Menu Style */
#sunnyrtemenu {
width:100%;
height:60px;
border: 1px solid #c0c0c0;
background-color:#efefef;
}
/* Menu Buttons Style */
.options {
 cursor:pointer;
 color: #000000;Verdana, Arial, Helvetica, sans-serif;
 font-size:16px;
 margin-left:3px;
 margin-right:3px;
}
a {
 text-decoration:none; /* Remove default underline for links */
}
</style>

<script type="text/javascript" src="js/jquery-2.0.3.js"></script> 
<script type="text/javascript">
$(function(){
 $('#sunnyrte').focus();
 // Complete rte editing Mozilla list at: https://developer.mozilla.org/en-US/docs/Rich-Text_Editing_in_Mozilla
 //                   Statement: object.execCommand(commandIdentifier, userInterface, value);
 // Click #delete ->                    execute command delete ->                 only on focus text of #sunnyrte
 $('#delete').click(function(){document.execCommand('delete', false, null);$('#sunnyrte').focus();return false;});
 // Removes all formatting from the current selection
 $('#removeformat').click(function(){document.execCommand('removeFormat', false, null);$('#sunnyrte').focus();return false;});
 // Undo
 $('#undo').click(function(){document.execCommand('undo', false, null);$('#sunnyrte').focus();return false;});
 // Redo
 $('#redo').click(function(){document.execCommand('redo', false, null);$('#sunnyrte').focus();return false;});
 // Bold
 $('#bold').click(function(){document.execCommand('bold', false, null);$('#sunnyrte').focus();return false;});
 // Italic
 $('#italic').click(function(){document.execCommand('italic', false, null);$('#sunnyrte').focus();return false;});
 // Underline
 $('#underline').click(function(){document.execCommand('underline', false, null);$('#sunnyrte').focus();return false;});
 // Strike
 $('#strike').click(function(){document.execCommand('strikeThrough', false, null);$('#sunnyrte').focus();return false;});
 // Color RED
 $('#red').click(function(){document.execCommand('foreColor', false, "#ff0000");$('#sunnyrte').focus();return false;});
 // Decrease Font Size - decreaseFontSize does not work in Chrome
 $('#decreasefont').click(function(){document.execCommand('decreaseFontSize', false, null);$('#sunnyrte').focus();return false;});
 // Increase Font Size - increaseFontSize does not work in Chrome
 $('#increasefont').click(function(){document.execCommand('increaseFontSize', false, null);$('#sunnyrte').focus();return false;});
 // Font size
 $('#fontsize').click(function(){document.execCommand('fontSize', false, "5");$('#sunnyrte').focus();return false;});
 // Font name
 $('#fontname').click(function(){document.execCommand('fontName', false, "Verdana");$('#sunnyrte').focus();return false;});
 // Subscript
 $('#subscript').click(function(){document.execCommand('subscript', false, null);$('#sunnyrte').focus();return false;});
 // Superscript
 $('#superscript').click(function(){document.execCommand('superscript', false, null);$('#sunnyrte').focus();return false;});
 // Hilite
 $('#hilitecolor').click(function(){document.execCommand('hiliteColor', false, "#ffff00");$('#sunnyrte').focus();return false;});
  // Justify Full
 $('#justifyfull').click(function(){document.execCommand('justifyFull', false, null);$('#sunnyrte').focus();return false;});
  // Justify Left
 $('#justifyleft').click(function(){document.execCommand('justifyLeft', false, null);$('#sunnyrte').focus();return false;});
  // Justify Right
 $('#justifyright').click(function(){document.execCommand('justifyRight', false, null);$('#sunnyrte').focus();return false;});
 // Indent
 $('#indent').click(function(){document.execCommand('indent', false, null);$('#sunnyrte').focus();return false;});
  // Outdent
 $('#outdent').click(function(){document.execCommand('outdent', false, null);$('#sunnyrte').focus();return false;});
  // Insert paragraph
 $('#paragraph').click(function(){document.execCommand('insertParagraph', false, null);$('#sunnyrte').focus();return false;});
 // Ordered List
 $('#orderedlist').click(function(){document.execCommand('insertOrderedList', false, null);$('#sunnyrte').focus();return false;});
 // Unordered List
 $('#unorderedlist').click(function(){document.execCommand('insertUnorderedList', false, null);$('#sunnyrte').focus();return false;});
 // Horizontal Role
 $('#inserthorizontalrule').click(function(){document.execCommand('insertHorizontalRule', false, null);$('#sunnyrte').focus();return false;});
 // Inser plain Text
 $('#inserttext').click(function(){document.execCommand('insertText', false, "This is a plain text");$('#sunnyrte').focus();return false;});
 // Insert HTML - insertHTML does not work on Internet Explorer
 $('#inserthtml').click(function(){document.execCommand('insertHTML', false, "<strong>This is a HTML Statement</strong>");$('#sunnyrte').focus();return false;});
 // Insert Table - insertHTML does not work on Internet Explorer
 $('#inserttable').click(function(){document.execCommand('insertHTML', false, "<table><tr><td>cell</td><td>cell</td></tr><tr><td>cell</td><td>cell</td></tr></table>");$('#sunnyrte').focus();return false;});
 // Insert Image - insertImage does not work on Internet Explorer
 $('#insertimage').click(function(){document.execCommand('insertImage', false, "http://www.lucedigitale.com/principale/images/logo.png");$('#sunnyrte').focus();return false;});
 // Insert Link
 $('#createlink').click(function(){document.execCommand('createLink', false, "http://www.lucedigitale.com/principale/images/logo.png");$('#sunnyrte').focus();return false;});
 // Unink
 $('#unlink').click(function(){document.execCommand('unlink', false, null);$('#sunnyrte').focus();return false;});
 // Show html tags
 $('#showhtml').click(function(){alert($("#sunnyrte").html());});
 });
</script>
 
</head>
<body>
 <div id="sunnyrtemenu">
 
  <!-- Every option need a id -->
  <a id="delete" href="#" class="options">|Delete|</a>
  <a id="removeformat" href="#" class="options">|Remove Format|</a>
  <a id="undo" href="#" class="options">|UNDO|</a>
  <a id="redo" href="#" class="options">|REDO|</a>
  <a id="bold" href="#" class="options"><b>|B|</b></a>
  <a id="italic" href="#" class="options"><i>|I|</i></a>
  <a id="underline" href="#" class="options"><u>|U|</u></a>
  <a id="strike" href="#" class="options"><strike>|A|</strike></a>
  <a id="red" href="#" class="options"><span style="color:red;">|RED|</span></a>
  <a id="decreasefont" href="#" class="options"><small>|Decrease|</small></a>
  <a id="increasefont" href="#" class="options"><big>|Increase|</big></a>
  <a id="fontsize" href="#" class="options"><font size=5>|Font Size 5|</font></a>
  <a id="fontname" href="#" class="options"><font face="verdana">|Verdana|</font></a>
  <a id="subscript" href="#" class="options"><sub>|Subscript|</sub></a>
  <a id="superscript" href="#" class="options"><sup>|Superscript|</sup></a>
  <a id="hilitecolor" href="#" class="options"><span style="background-color: #FFFF00">|Hilite|</span></a>
  <a id="justifyfull" href="#" class="options">|Justify Full|</a>
  <a id="justifyleft" href="#" class="options">|Justify Left|</a>
  <a id="justifyright" href="#" class="options">|Justify Right|</a>
  <a id="indent" href="#" class="options">|Indent|</a>
  <a id="outdent" href="#" class="options">|Outdent|</a>
  <a id="paragraph" href="#" class="options">|Insert Paragraph|</a>
  <a id="orderedlist" href="#" class="options">|Ordered List|</a>
  <a id="unorderedlist" href="#" class="options">|Unordered List|</a>
  <a id="inserthorizontalrule" href="#" class="options">|HR|</a>
  <a id="inserttext" href="#" class="options">|Insert Text|</a>
  <a id="inserthtml" href="#" class="options">|Insert HTML|</a>
  <a id="inserttable" href="#" class="options">|Insert Table|</a>
  <a id="insertimage" href="#" class="options">|Insert Image|</a>
  <a id="createlink" href="#" class="options">|Link|</a>
  <a id="unlink" href="#" class="options">|Unlink|</a>
  <a id="showhtml" href="#" class="options">|Show HTML|</a>
 </div>
 <div id="sunnyrte" contenteditable="true" unselectable="off">Write rich text here ....</div>
 <div>Instructions:
 <br>
 IMAGE EDITING: click the button "Insert Image", click on image, drag handles to resize, SHIFT+drag handles to maintain aspect ratio.
 <br>
 TABLE EDITING: click the button "Insert Table", click on table, drag handles to resize.
 </div>
</body>
</html>

How does it work?

1. Create the HTML code:

<div id="sunnyrtemenu">
 
  <!-- Every option need a id -->
  <a id="delete" href="#" class="options">|Delete|</a>
  ...
  <a id="showhtml" href="#" class="options">|Show HTML|</a>
 </div>
 <div id="sunnyrte" contenteditable="true" unselectable="off">Write rich text here ....</div>

We use and editable div, not a classic textbox.
We use a href to create the buttons

2. Style the CSS


<style>
/* Input Box Style */
#sunnyrte {
width:100%;
height:200px;
border: 1px solid #c0c0c0;
}
/* Menu Style */
#sunnyrtemenu {
width:100%;
height:60px;
border: 1px solid #c0c0c0;
background-color:#efefef;
}
/* Menu Buttons Style */
.options {
 cursor:pointer;
 color: #000000;Verdana, Arial, Helvetica, sans-serif;
 font-size:16px;
 margin-left:3px;
 margin-right:3px;
}
a {
 text-decoration:none; /* Remove default underline for links */
}
</style>

3. Load JQuery

<script type="text/javascript" src="js/jquery-2.0.3.js"></script>

4. The Javascript

...
// Bold
 
$('#bold').click(function(){document.execCommand('bold', false, null);$('#sunnyrte').focus();return false;});
 
...

For every command we use the statement: 

object.execCommand (commandIdentifier, userInterface, value);

The code is optimized to run on Mozilla Engine, some commands do not work in Chrome and IExplorer.
Next time I will work to improve cross browser compatibility :)

My official WebSite >

By |JQuery|Commenti disabilitati su Luce Digitale/JQ Sunny Rich Text Editor – Basic
Read More

JavaScript Calculator – Basic

JavaScript Calculator – Basic

By |JavaScript, Web Design|Commenti disabilitati su JavaScript Calculator – Basic
Read More

Luce Digitale/JQ Sunny Magnifier – Basic

Luce Digitale/JQ Sunny Magnifier – Basic

By |JQuery, Web Design|Commenti disabilitati su Luce Digitale/JQ Sunny Magnifier – Basic
Read More