DEPRECATED: Discourse masonry gallery theme component


(cpradio) #5

I believe to fix the translation you simply need to add this above your api call (with the appropriate key/values)

I18n.translations.en.js.composer.upload_gallery_images = "Upload Gallery Images here";

In your case, ‘Upload Gallery images here’ would become ‘upload_gallery_images’


(Joe) #6

YES! :grin::ok_hand: You’re absolutely correct @cpradio that worked like magic and I have already added it to the repo and the result is:

translated string working

this leaves only one really small detail since everything else is done here, the string for the composer button (when hovered) is still untranslated. but I am totally fine with that being so for now. :grin:

thank you so much @cpradio :wine_glass::wine_glass:


(Daniela) #7

You can update the version here:

<script type="text/discourse-plugin" version="0.4">

to 0.8.16. (the same as the other script you are using). As I said it was an oldddd script :smiley:


(cpradio) #8

If you provide a screenshot of the hover translation, I can help fix that too.


(Joe) #9

Awesome @cpradio
apologies for not adding this earlier :upside_down_face:

Thank you so much :sunflower:


That’s great @dax :ok_hand:

In that case I will merge the the two tags together since they both run under 0.8.16

I updated the repo :boom:


(cpradio) #10

I think this will do it.

I18n.translations.en.js.composer.Gallery = {text: "Gallery", title = "Gallery"};

(Joe) #11

@cpradio I get a syntax error when I add that.

So, just in case it’s something silly on my end (Most likely :sweat_smile:)

Here’s what it looks like: (i stripped the other script out)

<script type="text/discourse-plugin" version="0.8.16">

I18n.translations.en.js.composer.upload_gallery_images = "Upload Gallery Images here";
I18n.translations.en.js.composer.Gallery {text: "Gallery", title = "Gallery"};

    api.onToolbarCreate(function(toolbar){
      toolbar.addButton({
        trimLeading: true,
        id: 'Gallery',
        group: 'insertions',
        icon: 'picture-o',
        title: 'Gallery',
        perform: function(e){
          return e.applySurround('<div dir="rtl">\n\n', '\n</div>', 'upload_gallery_images')
        }
      });
    })
    
</script>

And here’s the error I get after saving

SyntaxError: unknown: Unexpected token, expected ; (5:41)

It’s strange that it’s saying the error is on line 4 when it goes away if I remove line 7


(cpradio) #12

Sorry, missed the = before {, fixed my post


(cpradio) #13

Just realized that line might not do it, it might actually need to be

I18n.translations.en.js.Gallery = "Gallery";

(Joe) #14

This worked beautifully! :champagne::champagne:

I added it to the repo

Thank you so much @cpradio :heart::boom:


(Bliketto) #15

How to install plugin?

      - git clone https://github.com/hnb-ku/discourse-masonry-gallery.git
      # cd /var/discourse && git pull && ./launcher rebuild app

but no luck, the button did not appear in the editor


(Joe) #16

@bliketto

I will add installation instructions to the OP later - I totally forgot that part :sunflower:


For now:

You don’t need to install this as a plugin. You should install it as a theme.

Once installed, you can add it as child theme under your current theme.


(Donald Swofford) #17

but no luck, the button did not appear in the editor

I also don’t have the photo gallery button?


(Joe) #18

Did the installation go ok @Donald_Swofford?

Are you seeing any errors in the console?

What version of Discourse are you on?


(Donald Swofford) #19

Version [v2.0.0.beta3 +11]

I didn’t get any error on the install and everything seems fine but it doesn’t even show up under plugins I installed spoiler alert at the same time and rebuilt and that is working fine. I also installed automatic featured image which doesn’t seem to be working either


(Donald Swofford) #20

Do I need the image gallery plugin as well? I don’t have that Image Gallery Plugin


(Joe) #21

Now I see where the problem is.

You installed it as a plugin. This is actually a theme component. Themes work right away and don’t need the app to be rebuilt.

No you don’t need anything else. This is standalone.

See this topic for how to install a theme

Once installed, you can add it as a child theme under your current theme.

I’m waiting for a couple of updates in Discourse to trickle down to update the theme and OP to add clear installation instructions.

Let me know if you need more help


(Donald Swofford) #22

Amazing. that was much easier and is working brilliantly. Now my images are all neat and tidy and don’t scroll forever.

Thank you so much for the reply!


(Joe) #23

This theme component is now depreciated

I have rewritten it from scratch it and to avoid any confusion created a new repo and a new topic.

This version will continue to function but will not receive any updates.

I will provide details on how to move your old galleries to the new structure if needed.

However, the simple version is after you install the new version you need to change every

<div dir="rtl">

to

<div data-theme-tiles="1">

That’s it.

Sorry about any inconvenience.


(Régis Hanol) closed #24