Joomla Templates Club 406,261 posts

[Meng Fei Koo Friend Meng Fei KooJoin date: September 2014Posts: 76Downloads:0Uploads:2 Thanks: 11 Thanked: 2 times in 1 posts]

#202688

Hi,

Under contact page of Uber-Corporate, how can I configure so that the map will shown in small/extra small under Theme Manager > Responsive Layout Position.

It seems like the position “full-width” was not controllable.

Thanks
KMF

[Eragon H Friend Eragon HJoin date: July 2014Posts: 468Downloads:1Uploads:39 Thanks: 5 Thanked: 156 times in 149 posts]

#555171

You can enable this “full-width” position as below

Extenstion >> Template Manager >> Style “uber – – Default” >> Tab: Layout >> Responsive >> Extra Small >> Enable “full-width” position >> http://prntscr.com/565y4w

Result: http://prntscr.com/565ys6

If you still face problems, kindly PM your site URL and temporary admin account. I can have a look

[Meng Fei Koo Friend Meng Fei KooJoin date: September 2014Posts: 76Downloads:0Uploads:2 Thanks: 11 Thanked: 2 times in 1 posts]

#555244

Ok sorry I overlooked Style “uber – – Default”.

Now I enable the full-width and noticed that jmap do not center focus my location point (example shown here also have same issue http://prntscr.com/565ys6) . Anyway to make the location point/pin showing on center of map? And where can I find detail parameters I can refer if I want some configuration on jmap like not allow dragging of map.

[Eragon H Friend Eragon HJoin date: July 2014Posts: 468Downloads:1Uploads:39 Thanks: 5 Thanked: 156 times in 149 posts]

#555426

Hi KMF,

I’m currently out of office. I will reply your question as soon as I’m back

[Meng Fei Koo Friend Meng Fei KooJoin date: September 2014Posts: 76Downloads:0Uploads:2 Thanks: 11 Thanked: 2 times in 1 posts]

#555630

Any updates?

I also tried to use JACM Contact Info, Style 1 and assigned under corporate-home position. I need some helps on few things.

1. How to disable drag?
2. How to make the pin (location pin) on center when in small screen mode.
3. When the JACM Contact Info loaded in my home page, there is a big white gap between two module. How to clear it?

Please let me know if need access to the site.

[Eragon H Friend Eragon HJoin date: July 2014Posts: 468Downloads:1Uploads:39 Thanks: 5 Thanked: 156 times in 149 posts]

#555735

1. Add this code to the file root/plugins/system/jagooglemap/assets/script.js

Position: http://prntscr.com/57vock
Code to add:

mapOptions.draggable = false;

2. Add this code to the file root/templates/uber/css/custom.css (create this file if unavailable)

.map-container {
width: 100% !important;
}

Result >> http://prntscr.com/57vojv

3. You can add Module Class Suffix ” no-padding” (note: there is a space before no-padding) >> http://prntscr.com/57vord

Result >> http://prntscr.com/57voxl

[Meng Fei Koo Friend Meng Fei KooJoin date: September 2014Posts: 76Downloads:0Uploads:2 Thanks: 11 Thanked: 2 times in 1 posts]

#555760

Thanks Eragon,

I have tried, it works. But I see there are still some minor issue need to fine tune specially when come to small screen.

Now I trying this way. >> How do I create a customHTML which I can have two/more columns (left+right) on acm-footer (need to be responsive). Where I can have contact info (on left) and map on right. Please refer to attached file.

---

Attachments:

1. 

[Eragon H Friend Eragon HJoin date: July 2014Posts: 468Downloads:1Uploads:39 Thanks: 5 Thanked: 156 times in 149 posts]

#555767

You can try this

<div class = "col-lg-12">
<div class = "col-lg-6">
<dl class="info-list">
<dt> <i class="fa fa-home"></i> Address</dt>
<dd>1600 Amphitheatre Parkway, Mountain View, CA, 94043</dd>
<dt> <i class="fa fa-phone"></i> Phone</dt>
<dd>00 1 650-253-0000</dd>
<dt> <i class="fa fa-envelope-o"></i>Mail</dt>
<dd>webmaster@joomlart.com</dd>
<dt> <i class="fa fa-globe"></i>Web</dt>
<dd><a href="http://www.joomlart.com" title="Joomlart">http://www.joomlart.com</a></dd>
</dl>
</div
<div class = "col-lg-6">
{jamap to_location='3299, Jalan Permata 2, Arab-Malaysian Industrial Park,71800 Nilai, Negeri Sembilan Darul Khusus, West Malaysia.' }
</div>
</div>


Result: http://prntscr.com/57wirp

[Meng Fei Koo Friend Meng Fei KooJoin date: September 2014Posts: 76Downloads:0Uploads:2 Thanks: 11 Thanked: 2 times in 1 posts]

#555923

Hi Eragon,

Thanks. Almost there 🙂

Now I trying to make a dark bg on this module (I did few dark bg on other custom module). I have already this css in custom.css

.section_darkbg {
padding-top:50px;
padding-bottom:50px;
color:#FFFFFF;
background-color:#666666;
font-family:Verdana, Arial, Helvetica, sans-serif;
}


And on Advance > Module Class Suffix, I insert _darkbg. However the dark bg are not on full height. But when i resize window a little to min/smallest view it is ok as expected. Where I did wrong?

Max window screen > http://prntscr.com/588bh5
Small screen > http://prntscr.com/588bki

[Eragon H Friend Eragon HJoin date: July 2014Posts: 468Downloads:1Uploads:39 Thanks: 5 Thanked: 156 times in 149 posts]

#556023

I can see you fixed this issue >> http://prntscr.com/58hfau

[Meng Fei Koo Friend Meng Fei KooJoin date: September 2014Posts: 76Downloads:0Uploads:2 Thanks: 11 Thanked: 2 times in 1 posts]

#556077

Yeah. Keep fixing here and there…:((:((:((

Thanks

[Author]

Posts