Johnrdorazio
Joined August 15, 2020
Content deleted Content added
Johnrdorazio (talk | contribs) Tags: Mobile edit Mobile web edit |
Johnrdorazio (talk | contribs) Tags: Mobile edit Mobile web edit |
||
| (6 intermediate revisions by the same user not shown) | |||
Line 39:
</syntaxhighlight>
== Testing MobileDetect parser tags ==
===
Here is
==== Inline html ====▼
▲Here is a string that should only show on mobile devices: <mobileonly>**I AM A MOBILE DEVICE!**</mobileonly>
Here is
==== Block html ====▼
Here is an html block element that should only show on mobile, using the <code><mobileonly></code> tag:▼
▲Here is an html block-level element that should only show on mobile, using the <code><mobileonly></code> parser tag:
<mobileonly>
<div style="background-color:yellow;color:darkblue;font-weight:bold;text-align:center;">I AM A MOBILE DEVICE!</div>
</mobileonly>
=== Nomobile ===▼
==== Inline html ====▼
▲Here is a string that should only show on desktop devices: <nomobile>**I AM A DESKTOP DEVICE!**</nomobile>
▲Here is a block element that should only show on desktop, using the <code><nomobile></code> tag:
<nomobile>
<div style="background-color:yellow;color:darkblue;font-weight:bold;text-align:center;">I AM A DESKTOP DEVICE!</div>
</nomobile>
== Testing MobileDetect parser functions ==
Here is an inline string that should only show on mobile devices, using the <code>#mobileonly:</code> parser function with the second parameter set to true: {{#mobileonly:'''I am a MOBILE device!'''|true}}
Here is an inline string that should only show on desktop devices, using the <code>#nomobile:</code> parser function with the second parameter set to true: {{#nomobile:'''I am a DESKTOP device!'''|true}}
Here is an html block-level element that should only show on mobile, using the <code>#mobileonly:</code> parser function:
{{#mobileonly: <div style="background-color:yellow;color:darkblue;font-weight:bold;text-align:center;">I AM A MOBILE DEVICE!</div> |0}}
And here is an html block-level element that should only show on desktop, using the <code>#nomobile:</code> parser function:
{{#nomobile: <div style="background-color:yellow;color:darkblue;font-weight:bold;text-align:center;">I AM A DESKTOP DEVICE!</div> }}
== Testing MobileDetect parser tags and functions within nested wiki structures ==
The text within the body of this table should change based on whether it is being viewed from desktop or from mobile.
{| class="wikitable"
! !! Parser Tag !! Parser Function
|-
! Inline
| This is a <mobileonly inline>'''mobile'''</mobileonly><nomobile inline>'''desktop'''</nomobile> device
| This is a {{#mobileonly:'''mobile'''|inline}}{{#nomobile:'''desktop'''|inline}} device
|-
! Block
| Which device are you? <mobileonly><div style="background-color:yellow;color:darkblue;font-weight:bold;text-align:center;">I AM A MOBILE DEVICE!</div></mobileonly><nomobile><div style="background-color:yellow;color:darkblue;font-weight:bold;text-align:center;">I AM A DESKTOP DEVICE!</div></nomobile>
| Which device are you? {{#mobileonly: <div style="background-color:yellow;color:darkblue;font-weight:bold;text-align:center;">I AM A MOBILE DEVICE!</div> |0}}{{#nomobile: <div style="background-color:yellow;color:darkblue;font-weight:bold;text-align:center;">I AM A DESKTOP DEVICE!</div> }}
|}
== Testing MobileDetect parser tags containing nested wiki structures ==
This whole table should changed based on the type of device with which the page is viewed:
<mobileonly>
{| class="wikitable"
|-
| This is a '''mobile''' device
| Which device are you? <div style="background-color:yellow;color:darkblue;font-weight:bold;text-align:center;">I AM A MOBILE DEVICE!</div>
|}
</mobileonly>
<nomobile>
{| class="wikitable"
! Inline !! Block
|-
| This is a '''desktop''' device
| Which device are you? <div style="background-color:yellow;color:darkblue;font-weight:bold;text-align:center;">I AM A DESKTOP DEVICE!</div>
|}
</nomobile>
== Testing BibleGet tags ==
| |||