How to create a new block

[kbalajijan1]

Two things I would like to implement.

1. I would like to create a new block like logo or side article block.
2. I would like some fields need to be prefilled. ex: After the editor.html get loaded, I would like to prefill the Facebook or Twitter link programmatically and also I would like to check or un-check some of the social icons.

I think these two should be handled with Knockoutjs but I am not familiar with that. Your short brief would be very helpful to implement the above and learn Knockoutjs.

Thanks.

[bago]

I don't understand if you want to define new kind of blocks in the versafix-1 template or if you want the editor to start with some content already in place (some block and some configuration).

New kind of blocks can be defined by working in the master-template you want to "enrich": open templates/versafix-1/template-versafix-1.html and search for singleArticleBlock stuff... you will find some html and some "declaration"..

About prebuild content you can either invoke mosaico.init with your metadata/content or you can create a plugin and then alter the viewModel as you like (you will have to study the code).

[kbalajijan1]

I wanted to define a new block. Your explanation was very useful and I could able to create a new block after modifying templates/versafix-1/template-versafix-1.html. I duplicated the TitleBlock and It works fine.

But visible property didn't work.

I would like to display first name and last name in the section and I should able to hide or show by toogling visible property.

Could you tell me what I have missed here.

<!-- TitleBlock1 -->
<table class="vb-outer" width="100%" cellpadding="0" border="0" cellspacing="0" bgcolor="#bfbfbf"
  style="background-color: #bfbfbf; -ko-background-color: @externalBackgroundColor; -ko-attr-bgcolor: @externalBackgroundColor" data-ko-block="TitleBlock1">
    ...
    ...
      <tr>
        <td>
            <span data-ko-display="fnameVisible"><span data-ko-editable="text">First Name</span></span>
            <span data-ko-display="lnameVisible"><span data-ko-editable="text">Last Name</span></span>
        </td>
      </tr>        
    ...
    ...           
</table>
<!-- /TitleBlock1 -->

<style type="text/css">
  @supports -ko-blockdefs {
    ...
    ...
    fnameVisible {label: First Name; extend: visible; }
    lnameVisible {label: Last Name; extend: visible; }

    titleBlock1 { label: Name; properties: fnameVisible=true lnameVisible=true; theme: contentTheme}
    ...
    ...
  }
</style>

Thanks

[bago]

Sounds correct: does mosaico logs anything usefull in the javascript console about those toggle?

[kbalajijan1]

Thanks

[kbalajijan1]

Also, when I inspect the html, I can see the empty set. `

` `

<!-- /ko -->`

I tried the existing property titleVisible also. That too displays empty set. `

` Thanks

[bago]

It is "expected" that the comments have empty content when the value evaluate to false. Please post your complete template to a gist

[kbalajijan1]

I have created a gist. You can find my changes in the latest revision. https://gist.github.com/kbalajijan1/679be41fbadfc3350147

Now I can able to see the content but the second span content get repeated twice and the first span content doesn't display.

Thanks.

[bago]

You used the same variable (text) for both texts: <span data-ko-editable="text">First Name</span> Just name them "fnameText" and "lnameText" if they are 2 different contents...

[kbalajijan1]

Thank you very much, It works fine after changing the variable name.

One more thing I would like know. I want to give various link to a button block based on users.

i.e. If user1 clicks on button block, the link for that button should be filled dynamically/programmatically. Like different link should be filled for user2 when user2 clicks on button block.

Can we do it with simple JS or we have to handle it through knockout.js. Could you give some idea.

Thanks.

[bago]

Mosaico let you create an email template: he does not send email to "multiple users". You can't use javascript in email.

So you will have to create your own backend to send email and to alter the links for each email you send: but this is not related to mosaico at all.