URL personalizada desde un formulario de checkbox

Estoy tratando de crear una URL personalizada desde algunas casillas de verificación.

 TAG1
TAG2
TAG3

Tengo esto: http://www.exemple.com/search?q=label:TAG1&q=label:TAG2&q=label:TAG3

Pero quiero esto: http://www.exemple.com/search/?q=label:TAG1|label:TAG2|label:TAG3

Intenta con esto:
(las explicaciones están dentro del código)

 $(document).ready(function(){ $("form").on("submit",function(e){ // Disable the button's submit. e.preventDefault(); // Start setting a custon query. var query="?q="; // Check each checked checkboxes. $("input[type='checkbox']:checked").each(function(index){ // Adds | only on second and next... if(index>0){ query+="|"; } // Adds the value. query+=$(this).val(); }); //Redirect with the query in GET console.log( $(this).attr("action")+query ); window.location=$(this).attr("action")+query; }); }); 

CodePen

EDITAR

Agrega esto a tu :