[amosbatto]

Where in a process maker install should you put fonts you want to call from your skin's css file? and what should the url be for the location within the css file?

[amosbatto]

Place the font files in this directory for a manual install:
<install-directory>/processmaker/workflow/public_html/fonts/

In a Bitnami install, the directory is:
<install-directory>/processmaker-3.X.X.bX-X/apps/processmaker/htdocs/workflow/public_html/fonts/

Then, add the following to your .css file in the skin:

Code: Select all

@font-face {
  font-family: "myfont";
  src: url('../fonts/myfont-Bold.ttf') format('truetype'), 
    url('../fonts/myfont-Italics.ttf') format('truetype'), 
    url('../fonts/myfont-Regular.ttf') format('truetype');
}

Then, you can use the font name in your CSS definitions.
See: https://developer.mozilla.org/en-US/doc ... t-face/src

[mohamad]

Dear Amosbatto,
I added my fonts to below dirctory
D:\processmaker64-2\ProcessMaker3.4\new-processmaker\apps\processmaker\htdocs\workflow\public_html\fonts
Also, I added them to below dirctory
D:\processmaker64-2\ProcessMaker3.4\new-processmaker\apps\processmaker\htdocs\workflow\public_html\skins\neoclassic\fonts

After that, I added some codes in the below directory:
D:\processmaker64-2\ProcessMaker3.4\new-processmaker\apps\processmaker\htdocs\shared\skins\mohamad\css\style.css

@font-face {
font-family: "Yekan";
src: url('/skins/neoclassic/fonts/Yekan.woff') format('woff'), url('/skins/neoclassic/fonts/Yekan.ttf') format('truetype'), url('/skins/neoclassic/fonts/Yekan.svg') format('svg');

}

I did not see any change in PM workflow. I want to have my special font in dynaforms and the other parts? how can I do that?
I would be appreciated if you could help me with this.
Looking forward to your valuable comments.
Kind Regards

[amosbatto]

I wrote up instruction on how to add fonts to ProcessMaker:
https://www.pmusers.com/index.php/Add_f ... ocessMaker

[mohamad]

Dear Amosbatto,
I'm deeply grateful for your perfect answers. All of them are excellent and easy to understand.

[amosbatto]

Mohamad, I don't have time to figure out Jalali dates. Sorry.

[FitBoy01]

The Verdana, Geneva font family is web safe so you will not need to add files to the font folder.
The classes that handle the editors css are as follow:

Code: Select all

.mce-container, .mce-container *, .mce-widget, .mce-widget *, .mce-reset {
margin: 0;
padding: 0;
border: 0;
outline: 0;
vertical-align: top;
background: transparent;
text-decoration: none;
color: #333333;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 14px;
text-shadow: none;
float: none;
position: static;
width: auto;
height: auto;
white-space: nowrap;
cursor: inherit;
-webkit-tap-highlight-color: transparent;
line-height: normal;
font-weight: normal;
text-align: left;
-moz-box-sizing: content-box;
-webkit-box-sizing: content-box;
box-sizing: content-box;
direction: ltr;
}

So to change the font family and size you will need to add this to your css file.

Code: Select all

.mce-container, .mce-container *, .mce-widget, .mce-widget *, .mce-reset {
font-family: Verdana,Geneva,sans-serif;
font-size: 11px;
}

The file that has the above code needs to be called after the Bootstrap.min.css file in the header otherwise it will be overwritten.
Hope that helps.