Introducing Item Switcher...

Envato Customers Looking For
81
sevenspark said

Hi Jo,

I just made up this gist from the custom code I’m using in my switcher. Note that I’m using a modified version of the original script, so it may require some adjustments, but this is the basic idea.

Essentially, in addition to the normal elements in the theme array, I’ve defined a preview image URL and a product type. These are then added in the loop, and styled appropriately. Note that I’ve got it set up so that you can use a relative path (in which case, preview images would be stored in a directory ‘product_previews’), or absolute paths.

You can view my item demos to see the results.

Hope that helps! :slight_smile:

Chris

Sorry me again! How do you style the type : ‘type’=> “Responsive HTML5”?
That’s the bit I’m stuck on!

82
josweb said
sevenspark said

Hi Jo,

I just made up this gist from the custom code I’m using in my switcher. Note that I’m using a modified version of the original script, so it may require some adjustments, but this is the basic idea.

Essentially, in addition to the normal elements in the theme array, I’ve defined a preview image URL and a product type. These are then added in the loop, and styled appropriately. Note that I’ve got it set up so that you can use a relative path (in which case, preview images would be stored in a directory ‘product_previews’), or absolute paths.

You can view my item demos to see the results.

Hope that helps! :slight_smile:

Chris

Sorry me again! How do you style the type : ‘type’=> “Responsive HTML5”?
That’s the bit I’m stuck on!

I edited the gist to add the product type style. It’s just positioned absolutely positioned to the right and given a background :slight_smile:

83

@sevenspark big thanks :wink:

84
sevenspark said

Hi Jo,

I just made up this gist from the custom code I’m using in my switcher. Note that I’m using a modified version of the original script, so it may require some adjustments, but this is the basic idea.

Essentially, in addition to the normal elements in the theme array, I’ve defined a preview image URL and a product type. These are then added in the loop, and styled appropriately. Note that I’ve got it set up so that you can use a relative path (in which case, preview images would be stored in a directory ‘product_previews’), or absolute paths.

You can view my item demos to see the results.

Hope that helps! :slight_smile:

Chris

Thanks a million, you made this item switcher complete.

85
ThemeProvince said

Hi there, Today I created a file switcher that might be of use the envato community. Basically it removes the preview frame automatically. Then replaces it with a custom item switcher.

Demo

For a demo view one of my items (i cant post links here sorry).

Download

Here is the source code: http://labs.burntfeathers.com/themeselector/themeselector.zip

Installation (Very Easy)

  1. Firstly unzip and place the folder on your server. Place it in a directory like this: http://themes.yoursite.com/ - Though make sure its a new directory with nothing else in so you can use the root of the folder as the url.

  2. Open index.php and you will see a php array called $theme_array. You dont have to know php. For every item you create a new array like below:

$theme_array = array (

array ("id" => "adventure",
       "url" => "http://labs.burntfeathers.com/adventure",
	   "themeforest" => "http://themeforest.net/item/adventure-a-unique-photography-wordpress-theme/155571"
	  ),
array ("id" => "attique",
	   "url" => "http://labs.burntfeathers.com/attique",
	   "themeforest" => "http://themeforest.net/item/attique-a-stylish-multi-purpose-wordpress-theme/168724"
	  )

);
  1. In your item settings (Click Edit on your item page) set the preview url to this:

http://themes.yoursite.com/redirect.php?theme=yourthemename

So if you defined the theme in the php array $themearray as “adventure” then replace yourthemename above with adventure.

  1. Thats it, easy peasy :smiley:

Attribution

One more thing this is open source so you can change the logo, marry it or whatever. No attribution required.

Hope you find this useful.

:wink:

hi . very nice. how to download a last version. it isnt have previe image. HELP me .

86

What? :smiley:

87

@kaspersky: https://gist.github.com/1500326

88

Hey thank you for sharing! Pretty cool thing :slight_smile:

89

Awesome work!

90
digitalimpact said

@kaspersky: 1500326’s gists · GitHub

oh. sorry. how to use it

91

i dont understand it . help me. PLS

92
kaspersky said

i dont understand it . help me. PLS

what exactly don’t you understand? its pretty straight forward…

93
OrganicBeeMedia said
kaspersky said

i dont understand it . help me. PLS

what exactly don’t you understand? its pretty straight forward…

oh. i understand it. kkk. TQ

94

Will this work on Tumblr themes?

95
WildeMedia said

Will this work on Tumblr themes?

It works on all items that have self hosted previews.

96
ThemeProvince said
WildeMedia said

Will this work on Tumblr themes?

It works on all items that have self hosted previews.

Ok I’ll give it a try tonight. Thanks! :smiley:

97
revaxarts said

ups, found a little mistake in my snippet. Here’s the correct one:

$('.remove_frame').delegate('a','click',function(){
    top.location.href=$('#iframe')[0].contentWindow.location.href;
    return false;
});

Seems that it’s working only the first time when you remove the frame. If you go after to another location and try to remove the frame then you are redirected to the home page.

98

Thanks so much :wink:

99

We need a thank you button!

100

Thanks for the code, George :wink:

Here’s my modified version: http://demo.arrowthemes.com/redirect.php?theme=clarke-joomla

If you’ve noticed when you first load the preview, the styles are loaded nicely and the user can switch between theme styles. However if the user selects a different theme, I’m not able to load the php array list of the selected theme via js.

What I’ve done for the styles is add it as part of the array of the theme list - that kinda makes it hard for me to pull the list using javascript, obviously due to my limited knowledge in php/js. At the moment am just setting the styles list of the selected theme to blank to avoid the previous list from being visible.

I’d appreciate some help from any one on how to load the list of styles from the php array to the javascript on click event.

Here’s my PHP array code:

http://snippi.com/s/hs4yzx4

Here’s my js click event for the theme switcher:

http://snippi.com/s/xqn66qe

many thanks,
Joel