Post by qahar » Wed Oct 02, 2013 10:52 am

OpenCart Shortcodes is a technique which makes it easy to insert advanced content into OpenCart. OpenCart shortcodes based on Wordpress shortcodes API and share similiar format.

Download - Demo - Github Repo - Documentation

Note: OpenCart 1.5.x can use Shortcodes v1.1.1

===================================

OpenCart Shortcodes is a library and set of modification to enhance OpenCart with shortcodes based on Wordpress API. Initial modification of WordPress Shortcodes API is done by rempong.

Based on his modification I'm creating more possibility to play with it. The package come with default shortcode and of course possibility to extend available shortcode. Right now I'm still develope it but it's ready for public test, expecting feedback.

Within download package I put sample code for quick test.
This is screenshoot of information page with the sample code:
quick-sample-code.jpg

quick-sample-code.jpg (241.41 KiB) Viewed 23770 times

For 3rd extensions/ theme developer who want to make their work Shortcodes ready, please refer to this docs.

Image
Last edited by qahar on Wed Aug 24, 2016 6:07 am, edited 13 times in total.
Reason: released

User avatar
Expert Member

Posts

Joined
Tue Jun 29, 2010 10:24 pm
Location - Indonesia

Post by OSWorX » Wed Oct 02, 2013 3:20 pm

Just for my (and maybe others) understanding: how will those codes be used (I do not know WordPress)?
As far as I can see (GitHub) they have to be embedded in templates (.tpl) - correct?

If, it seems to me quite static - thinking in the term of multilingual. Or how will this be solved?

Full Stack Web Developer :: Dedicated OpenCart Development & Support DACH Region
Contact for Custom Work / Fast Support.


User avatar
Guru Member

Posts

Joined
Mon Jan 11, 2010 10:52 pm
Location - Austria

Post by rempong » Wed Oct 02, 2013 8:41 pm

Yes, it is embedded in template. It can be extended, ex: the shortcode built by module / extension. And maybe execute some anonymous / closure in database

OPENCART MODULE :
Opencart Compare Link Link your compared product to forum/email

Frontend Link From Admin Dashboard
Get link to product , category, manufacturer, information from admin backend.

Copy and DIRECTLY Edit Product the easy way.

Custom Product Sort Full control to product sorting options

Already Sold Product Module, shows total product sold


Active Member

Posts

Joined
Fri Sep 14, 2012 2:38 pm
Location - Indonesia

Post by rempong » Wed Oct 02, 2013 8:43 pm

@qahar:

Code: Select all

function add_shortcode($tag, $func, $class) {
there is no default value for "$class" ? so only Class can do "add_shortcode" ?

OPENCART MODULE :
Opencart Compare Link Link your compared product to forum/email

Frontend Link From Admin Dashboard
Get link to product , category, manufacturer, information from admin backend.

Copy and DIRECTLY Edit Product the easy way.

Custom Product Sort Full control to product sorting options

Already Sold Product Module, shows total product sold


Active Member

Posts

Joined
Fri Sep 14, 2012 2:38 pm
Location - Indonesia

Post by qahar » Wed Oct 02, 2013 8:56 pm

Screenshoot above is not template (.tpl), it's information page.

An overview how it work Shortcode format overview:

Code: Select all

[link_product id="x" path="xy_xz"]custom text[/product_link]
  • Tag : link_product
  • Arguments : id, path
  • Content : "custom text"
Shortcode above is handled dynamicly with code below at shortcodes_default.php:

Code: Select all

function link_product($atts, $content = '') {
   extract(shortcode_atts(array(
      'id'     => 0,
      'path'   => 0,
      ...
   ), $atts));
   
   if ($id) {
      $ssl     = ($ssl) ? "'SSL'" : "";
      $title   = ($title) ? 'Title="' . $title . '"' : "";

      if (!$content) {
         $this->load->model('catalog/product');
         $product = $this->model_catalog_product->getProduct($id);
      
         if(!$path && !$brand) {
            return '<a href="' . $this->url->link('product/product', 'product_id=' . $id, $ssl) . '" ' . $title . '>' . $product['name'] . '</a>';
         } elseif ($path && (!$brand || $brand)) {
         ... ...
      } elseif ($content) {
         if(!$path && !$brand) {
            return '<a href="' . $this->url->link('product/product', 'product_id=' . $id, $ssl) . '" ' . $title . '>' . $content . '</a>';
         } elseif ($path && (!$brand || $brand)) {
         ... ...
      }
   }
}
Converted into end result:

Code: Select all

<a href="'.$this->url->link('product/product', 'product_id='.$id.'&path='.$path, $ssl).'" '.$title.'>' .$content. '</a>
You can use most OpenCart API like load model, use multi-language, get child mvc or even for the sake of simply formating embedded video.

User avatar
Expert Member

Posts

Joined
Tue Jun 29, 2010 10:24 pm
Location - Indonesia

Post by rempong » Wed Oct 02, 2013 9:06 pm

Sorry, I missed opencart_shortcodes.xml:D

I assume "themeShortcodes" is from

Code: Select all

 DIR_TEMPLATE . $this->config->get('config_template') . '/shortcodes.php';
right ?

OPENCART MODULE :
Opencart Compare Link Link your compared product to forum/email

Frontend Link From Admin Dashboard
Get link to product , category, manufacturer, information from admin backend.

Copy and DIRECTLY Edit Product the easy way.

Custom Product Sort Full control to product sorting options

Already Sold Product Module, shows total product sold


Active Member

Posts

Joined
Fri Sep 14, 2012 2:38 pm
Location - Indonesia

Post by qahar » Wed Oct 02, 2013 9:28 pm

rempong wrote:Sorry, I missed opencart_shortcodes.xml:D

I assume "themeShortcodes" is from

Code: Select all

 DIR_TEMPLATE . $this->config->get('config_template') . '/shortcodes.php';
right ?
Yes. Put shortcodes Create shortcodes function at template file is not good practice and hard for other dev to track.
So we create something similiar to functions.php at wordpress.

Use shortcodes.php to extend or overwrite the default shortcodes.
When dealing to end result, a theme must have a clean way to overwrite default shortcodes.
If default opencart module have suffix input for css class, it will be more fleksibel to formating module layout.

User avatar
Expert Member

Posts

Joined
Tue Jun 29, 2010 10:24 pm
Location - Indonesia

Post by labeshops » Wed Oct 02, 2013 9:58 pm

I think I'm missing something. I've used shortcodes in wp, but not sure if there is an extra step I am missing here or what?

I copied the 2 files to the system/library and the vqmod to the folder, then tried to insert into my product template

Code: Select all

[module_product type="featured" limit="5" img_w="100" img_h="100" /]


as shown in your example, but it just displayed this line in my frontend as code. Do I need to wrap it in something?

Also, can I use any additional modules I have installed this way, for example the related products module or would I need to make some change to the other code to make it work??? or could I just do

Code: Select all

[module_product type="related" limit="5" img_w="100" img_h="100" /]
???

Running Opencart v3.0.3.2 with multi-stores and the default template from https://www.labeshops.com which has links to all my stores.


User avatar
Expert Member

Posts

Joined
Thu Aug 04, 2011 4:41 am
Location - Florida, USA

Post by labeshops » Wed Oct 02, 2013 10:17 pm

Okay, so I figured out my mistake.

I didn't realize your "overview how it works" was links to github - thought they were the actual files. I right clicked, saved as, and uploaded them. Then discovered they were html pages lol So clicked on them and went to github, got just the code, replaced the files and it works :)

Also, I discovered my second question about related module works just fine! See http://www.mildtowildshoes.com/red-sequ ... 15flamingo - I used shortcodes to put the related product module in the middle of my product template! Awesome! Still need to format it a bit better, but it works!

Thanks for a great project!

Running Opencart v3.0.3.2 with multi-stores and the default template from https://www.labeshops.com which has links to all my stores.


User avatar
Expert Member

Posts

Joined
Thu Aug 04, 2011 4:41 am
Location - Florida, USA

Post by Qphoria » Wed Oct 02, 2013 11:15 pm

We need a way to use them in product description. I'd imagine it might be possible in "Source" mode to add them ?

Image


User avatar
Administrator

Posts

Joined
Tue Jul 22, 2008 3:02 am

Post by OSWorX » Wed Oct 02, 2013 11:27 pm

Qphoria wrote:We need a way to use them in product description. I'd imagine it might be possible in "Source" mode to add them ?
Not only at product description - would like to have them everywhere the editor is used (products, categories, texts, etc.)

Full Stack Web Developer :: Dedicated OpenCart Development & Support DACH Region
Contact for Custom Work / Fast Support.


User avatar
Guru Member

Posts

Joined
Mon Jan 11, 2010 10:52 pm
Location - Austria

Post by labeshops » Wed Oct 02, 2013 11:33 pm

Qphoria wrote:We need a way to use them in product description. I'd imagine it might be possible in "Source" mode to add them ?
Actually, it works this way too. I tested adding a shortcode in the description - didn't even have to use source view! See screenshot (I'm not keeping this block but the latest one is what I added).

Now we need more shortcodes developed! Not sure how to do that myself - will have to study the example code a LOT.

Would like to see them for store name, link etc which would be very useful for multistores.

Attachments

shortcode-in-description.jpg

shortcode-in-description.jpg (50.52 KiB) Viewed 23713 times


Running Opencart v3.0.3.2 with multi-stores and the default template from https://www.labeshops.com which has links to all my stores.


User avatar
Expert Member

Posts

Joined
Thu Aug 04, 2011 4:41 am
Location - Florida, USA

Post by qahar » Wed Oct 02, 2013 11:48 pm

labeshops wrote: Also, I discovered my second question about related module works just fine! See http://www.mildtowildshoes.com/red-sequ ... 15flamingo - I used shortcodes to put the related product module in the middle of my product template! Awesome! Still need to format it a bit better, but it works!

Thanks for a great project!
Module have lot of setting variant, since module latest, featured, special and bestseller is share same setting I populate them into one module_product shortcode.

I plan to put video embed for the rc2. I know we can put the code directly to content.
But using [youtube]http://www.youtube.com/watch?v=xyz[/youtube] is much more easier.

User avatar
Expert Member

Posts

Joined
Tue Jun 29, 2010 10:24 pm
Location - Indonesia

Post by qahar » Wed Oct 02, 2013 11:50 pm

Qphoria wrote:We need a way to use them in product description. I'd imagine it might be possible in "Source" mode to add them ?
The best way to use it is actually in "source" mode. Because in default editor mode, sometime CKEditor put html entities or wrap the shortcode with <span> and it break the shortcodes.

We see this at default editor mode:

Code: Select all

[link_product id="42" /]
But actually, when see it at "source" mode there is extra html entities that make it fail:

Code: Select all

[link_product&nbsp;id="42" /]
and in my experience, sometime ckeditor wrap it with span

Code: Select all

<span style="font-size:13px">[link_product</span> id="42" /]

User avatar
Expert Member

Posts

Joined
Tue Jun 29, 2010 10:24 pm
Location - Indonesia

Post by labeshops » Wed Oct 02, 2013 11:51 pm

OSWorX wrote:
Qphoria wrote:We need a way to use them in product description. I'd imagine it might be possible in "Source" mode to add them ?
Not only at product description - would like to have them everywhere the editor is used (products, categories, texts, etc.)
It seems to already work everywhere! Added the latest module to an info page http://www.mildtowildshoes.com/about-high-heels-info !! Haven't tried it on other text items, but my guess is it will work site wide no matter if you add it to a editor box or a template! Extremely awesome IMO!!

Running Opencart v3.0.3.2 with multi-stores and the default template from https://www.labeshops.com which has links to all my stores.


User avatar
Expert Member

Posts

Joined
Thu Aug 04, 2011 4:41 am
Location - Florida, USA

Post by qahar » Wed Oct 02, 2013 11:54 pm

labeshops wrote:Would like to see them for store name, link etc which would be very useful for multistores.
Read the shortcode test at installation on wiki page.
Shortcodes link is already available.

User avatar
Expert Member

Posts

Joined
Tue Jun 29, 2010 10:24 pm
Location - Indonesia

Post by qahar » Wed Oct 02, 2013 11:58 pm

labeshops wrote:
OSWorX wrote:
Qphoria wrote:We need a way to use them in product description. I'd imagine it might be possible in "Source" mode to add them ?
Not only at product description - would like to have them everywhere the editor is used (products, categories, texts, etc.)
It seems to already work everywhere! Added the latest module to an info page http://www.mildtowildshoes.com/about-high-heels-info !! Haven't tried it on other text items, but my guess is it will work site wide no matter if you add it to a editor box or a template! Extremely awesome IMO!!
It's work in module welcome and even in template file.
shortcode-hedaer-tpl.png

shortcode-hedaer-tpl.png (36.96 KiB) Viewed 23709 times


User avatar
Expert Member

Posts

Joined
Tue Jun 29, 2010 10:24 pm
Location - Indonesia

Post by labeshops » Thu Oct 03, 2013 12:35 am

qahar wrote:
labeshops wrote:Would like to see them for store name, link etc which would be very useful for multistores.
Read the shortcode test at installation on wiki page.
Shortcodes link is already available.
sorry I meant link to the store, not a link to a product. a [store_name] [store_link] that inserts the current store name or link to the store the customer is on would be useful to me especially in the product and category description if I want to reference the store they are currently browsing but that product is on more than 1 store.

Hope that makes more sense :P

Running Opencart v3.0.3.2 with multi-stores and the default template from https://www.labeshops.com which has links to all my stores.


User avatar
Expert Member

Posts

Joined
Thu Aug 04, 2011 4:41 am
Location - Florida, USA

Post by qahar » Thu Oct 03, 2013 2:34 pm

Update to v.1.0-rc.2

* Fixed
^ Improvements
+ New Feature
~ Deprecated

Changelog: v.1.0-RC.2
^ Return plain text when product (etc) not found. Except link custom.
^ Wrap shortcode module with specific css class. Make it easy restyling module through stylesheet.
+ Link store shortcode for generate link to other store (multi-store).
+ Slideshow module shortcodes.
+ Video shortcodes, supoorting youtube and vimeo.

User avatar
Expert Member

Posts

Joined
Tue Jun 29, 2010 10:24 pm
Location - Indonesia

Post by qahar » Thu Oct 03, 2013 2:36 pm

labeshops wrote: sorry I meant link to the store, not a link to a product. a [store_name] [store_link] that inserts the current store name or link to the store the customer is on would be useful to me especially in the product and category description if I want to reference the store they are currently browsing but that product is on more than 1 store.

Hope that makes more sense :P
Add new shortcodes on rc2 with this format

Code: Select all

[link_store store="1" route="product/product" args="path=xyz&product_id=x"]
Test it at your multistore and give me the feedback.

User avatar
Expert Member

Posts

Joined
Tue Jun 29, 2010 10:24 pm
Location - Indonesia
Who is online

Users browsing this forum: No registered users and 22 guests