mNo edit summary |
mNo edit summary |
||
| Line 27: | Line 27: | ||
|- | |- | ||
| Import CSV || | | Import CSV || | ||
| Sidebar Edit || where to edit the sidebar || https://moha.wiki/MediaWiki:Sidebar | |||
|- | |||
# Use Overwrite existing content for new pages and complete replacement of the imported events | # Use Overwrite existing content for new pages and complete replacement of the imported events | ||
# Use Overwrite only fields contained in the file can be used if you upload a single column (the CSV need to be modified then to include the title and only the columns for import) | # Use Overwrite only fields contained in the file can be used if you upload a single column (the CSV need to be modified then to include the title and only the columns for import) | ||
| Name | Description | Link | ||
|---|---|---|---|---|
| Forms | a list of all forms that have been created to enter data | https://moha.wiki/Special:Forms | ||
| Templates | all templates that have been created to format and parse data | https://moha.wiki/Special:Templates | ||
| Semantic Search | a page to query wiki data and produce pieces of code for embedding on pages | https://moha.wiki/Special:Ask | ||
| Properties | all properties within mediawiki | https://moha.wiki/Special:Properties | ||
| Categories | all categories that currently exist for sorting and labeling pages | https://moha.wiki/Special:Categories | ||
| CSS Page | Where all CSS exists | https://moha.wiki/MediaWiki:Common.css | ||
| Java Script Page | Where all Javascript Exists | https://moha.wiki/MediaWiki:Common.js | ||
| Import CSV | Sidebar Edit | where to edit the sidebar | https://moha.wiki/MediaWiki:Sidebar | |
| https://moha.wiki/Special:ImportCSV | ||||
| Export CSV | Export Mediawiki CSV | Export CSV | ||
| Batch Upload | Upload Media Files in Bulk | https://moha.wiki/Special:BatchUpload | ||
| Individual Program Page Styles | to change design or colorways on program pages | https://moha.wiki/Special:AllPages?from=&to=&namespace=274 | ||
| Article Submission Form | see below for instructions on how to use | https://moha.wiki/Form:Article | ||
| Filters for Press Table and Events | adjustments for how the filter function works | https://moha.wiki/MediaWiki:Gadget-datatables.js |
In the MidnightCommander navigate to backup-database.sh script and run it by pressing Enter on your keyboard.
The database will be stored in the same directory with the date in its name. To delete an old database copy, navigate to it in MC and press F8.
The extension EmbedVideo can be used to embed video from sites like Youtube, Vimeo etc... The full parameters you can call are as follows: {{#ev:service|id|dimensions|alignment|description|container|urlargs|autoresize|valignment}} for example for a youtube video you could use the following code {{#ev:youtube|https://www.youtube.com/watch?v=eAORm-8b1Eg}}
For a full explanation or more details you can go to: https://www.mediawiki.org/wiki/Extension:EmbedVideo
To use an image that is responsive to screen size in the embed use the following format
[[File:FILNAMEHERE.JPG|class=img-fluid|from [[EVENT NAME]], a [[PROGRAM NAME]], YEAR]]
or for a practical example
[[File:MoHA 20221217 TheShabooming 0623.JPG|class=img-fluid|From [[The Shabooming]], a MoHA [[Holiday Show]], 2023]]
<span class="moha-button">[[Fantastic Arcade Committee Application|Internal Link]]</span>
Demonstration
Internal Link
<span class="moha-button">[https://google.com External Link]</span>
Demonstration
External Link
{{#externalredirect: WEBSITE GOES HERE}}
To edit an external redirected page, use https://moha.wiki/w/index.php?title=PAGE NAME GOES HERE&action=edit
This piece of code can bring in a section from a page, for example if the page is "CATS+" and it has a section named "About" (as defined by ==SECTION NAME==) you could use the code {{#lsth:CATS+|About}}
{{#lsth:PAGENAME|SECTIONNAME}}
For a full breakdown of this tool go to: https://www.mediawiki.org/wiki/Extension:Labeled_Section_Transclusion
For something like a program page, to pull in the "Program short description" use the following code to pull in just the respective short description
{{#ask: [[Program name::CATS+]]
| ?Program short description
| format=list
| link=none
| headers=hide
| mainlabel=-
}}
New semantic queries can be created using the Semantic Search page. For a full description of the semantic search page you can visit here.
On this page the left column you "ask" the mediawiki to provide you information that matches your criteria.
That criteria is any element that is a property within mediawiki and could be categories, event names, start dates etc....
So for example you could "ask": provide everything that is within the category of events. The code to do this is [[Category:Events]] .
To note, a bug within mediawiki semantic search has led us to include [[Modification date::+]] within all semantic queries.
So the code to semantically query all events in this case would be [[Category:Events]] [[Modification date::+]]. On the right you want to provide all the properties you'd like the query to return. For a list of all properties you can visit Properties. For an individual page or events properties you can visit any given page and in the bottom left, click tools and then browse properties. This will show you all properties on that page as well as the values within those properties. In our example we're going to return the following properties
?Event description ?Date Start ?Date End ?Event image ?Event name
Specific things within the following form to remember are. We must use "named arguments" so that box must be checked, that means that our properties are text names and not numeric values.
To use a template that has been created to hold this data, you use the option "plainlist" and the template name that's been created. More info on other options can be found at the initial link. An example of the final piece of code in this instance might look like
{{#ask: [[Category:Events]] [[Modification date::+]] [[Event name::Interactive_Drive-In_Media_101 || Hacking_old_tech:_Mystic_Hotline || AR_collaboration:_flARmingos]]
|?Event description
|?Date Start
|?Date End
|?Event image
|?Event name
|format=plainlist
|limit=50
|offset=0
|link=all
|sort=Date Start
|order=asc
|headers=show
|searchlabel=... further results
|propsep=,
|valuesep=,
|template=Single_Event_Display
|named args=1
|class=sortable wikitable smwtable
}}
Code Overview
{{#ask: [[Category:CATEGORY NAME]] [[Modification date::+]] [[PROPERTY::PROPERTY NAME]]
//PROPERTIES TO BE QUERIED OR DISPLAYED MUST GO BELOW//
|?Event description
|?Date Start
|?Date End
|?Event image
|?Event name
//ALL SPECIFIC OPTIONS//
|format=plainlist - MUST BE USED FOR USING A TEMPLATE
|limit=50 - LIMIT OF HOW MANY RESULTS TO DISPLAY
|offset=0
|link=all
|sort=Date Start - SORT FIELD
|order=asc - SORT ORDER
|headers=show - IF YOU WANT TO DISPLAY HEADERS OR NOT
|searchlabel=... further results
|propsep=, - NEEDS TO BE A COMA
|valuesep=, - NEEDS TO BE A COMA
|template=Single_Event_Display - THIS IS HOW THIS INFORMATION WILL BE DISPLAYED, OR WHERE THE QUERY WILL BE PASSED THROUGH, DESIGN MUST BE EDITED ON THE TEMPLATE FOR CHANGES, BUT THOSE CHANGES WILL BE THROUGH THE ENTIRE WIKI
|named args=1 - MUST BE CHECKED
|class=sortable wikitable smwtable
}}
{{#ask: [[Category:CATEGORY NAME]] [[Modification date::+]] [[PROPERTY::PROPERTY NAME]]
''PROPERTIES TO BE QUERIED OR DISPLAYED MUST GO BELOW''
|?Event description
|?Date Start
|?Date End
|?Event image
|?Event name
|format=plainlist
|limit=50
|offset=0
|link=all
|sort=Date Start
|order=asc
|headers=show
|searchlabel=... further results
|propsep=,
|valuesep=,
|template=Single_Event_Display
|named args=1
|class=sortable wikitable smwtable
}}
A good option for this is to use the CSS Grid. https://css-tricks.com/snippets/css/complete-guide-grid/
I've marked the necessary HTML and CSS with comments in the Codepen for reference. https://codepen.io/Nick-Sergent/pen/mdQKbaZ
The gist: The client will need to add the image within the "moha-start-section" div of the Artist Start page. Keep in mind that this needs to be after the "moha-start-section-content" div. This will place the text content and image next to one another in the "moha-start-section" div. We then use CSS to set those elements in a grid structure and define column widths that make it responsive for different screens.
That is this line: grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
If the client would like to adjust the breakpoint at which the text content and image break onto two lines they can change the pixel value in that line.
If the client needs a more detailed explanation of what's going on, this article explains the responsive CSS. https://css-tricks.com/look-ma-no-media-queries-responsive-layouts-using-css-grid/
The following CSS was added to the stylesheet for this element
/* start page intro image setup */
.moha-start-section {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
}
.moha-start-section > p {
margin-bottom: 0;
}
.moha-start-section .image img {
object-fit: cover;
max-width: 100%;
max-height: 430px;
padding: 0;
margin: 0;
float: right;
}
This is your start page intro code:
Below you'll find guides and information for artists interested in getting involved at MoHA.
As first steps we recommend
For a list of programs and opportunities for specific fields you can skip to
div class="moha-start-section-quicklinks"
The Article form is here: https://moha.wiki/Form:Article
To assign Articles to other categories, add those categories as subcategories of the. Put this code on the needed category page (see https://moha.wiki/Special:Categories). Multiple levels are supported:
Category:Article ---|- Category:Subcategory1 [[Category:Article]] ---|---|- Category:Sub-Subcategory1 [[Category:Subcategory1]] ---|---|---|- ... and so on
